Why does my custom JS only effect the first element populated by the CMS?

Design help Custom code
1

I have a page that is using the CMS to generate elements that when clicked, will open a pop-up with a video that is also linked via the CMS.

I wrote some JS to set the video to autoplay when the pop-up is opened, and stop playing when the pop-up is triggered to close.

My JS is set to effect the classes, and not the IDs so I know this is not the issue.

The problem is that this only applies to the very first element generated on the page. When I click the first element, the pop up opens, the video plays, and when I close it the video stops.

But when I click the other elements, and try to close the pop up, the video continues playing in the background.

Has anyone ran into this before? How can I get my JS to apply to all the elements in the CMS?

2

Without a link to the project read-only or the code you’re using it’s going to be pretty difficult to diagnose any issues.