How to bind webflow interactions to dynamic elements

Design help Custom code
1

Hi,

I am building a page using the typical Ordered List elements <ol><li></ol>. The first elements are static and were added via the Webflow Designer. They are followed by a few list items added dynamically using Javascript.

I created interactions for the “static” list items and expected them to work with the dynamically added items too. But it turns out they don’t. Even after making sure they use the exact same structure and classes.

My guess is that Webflow binds its interactions to existing elements on page load.

Is there a way to bind Webflow interactions to elements after the page has loaded?
Or is there a way to make webflow wait for my script to add elements before it runs its biding script?

Any help will be very much appreciated!

2

Replying to my own question here in case anyone finds it helpful.

Running the command:

Webflow.require('ix2').init();

It tells webflow to initialise or re-initialise the interactions. So it binds all elements on the page again. It works like a charm.

1 Like
3

Nice solution @gvdias!

1 Like