2 embed in same page doesnt work

Hey!

I’m having duplicate HTML embeds on the same page, one of them works other doesn’t. Why doesn’t the browser read the second one or what might cause the problem?

I tried to change the classes of the second embed, didn’t work

Any help would be much appreciated

Read only:
https://preview.webflow.com/preview/storm-f1?utm_medium=preview_link&utm_source=designer&utm_content=storm-f1&preview=c994dfe25e1407394deb60f072e773d0&pageId=63c9100a37fba97cc57b37d3&workflow=preview

Try moving the script to the code section of the page and the styles to the head.

Thanks for help - how can I reference it to HTML embed if the code goes inside the page? I have searchable dropdowns inside HTML embed

Your staging site is password protected, so it’s not possible to check for script errors.

However the main problem I see is that both of dropdown lists are using the same ID, and your scripts are acting on that same ID. If both are running successfully, they’re both probably affecting the first list only.

Also, you should move the <style> content into the HEAD custom code, and your <script> into the BODY custom code. You only need one copy of those, as @aaronocampo advised. You’d need to make some changes to your script as well so that one script will work properly for both buttons.

Thanks for help - moved CSS to page head and JS to page body.

Heres where Im at currently. Tried to difference of called IDs of dropdown lists , not working. Not sure what am I doing wrong or how can it be done

JS in the body - gave the JS 2 different IDs

2 HTML embed
#Dropdown-list

#Dropdown-list2

Hi Ove, getElementById can only take one ID.
My guess is you’ve inherited some code that you’re trying to fix, or used ChatGPT to generate the basics? However you’ll need a different approach and I’m suspicious about that input event listener, it looks like you’re trying to create an autocomplete feature of some form.

I’ll do a video and message you directly.