The basic logic:
In the HTML, a user puts the dropdown content under a .dropdown-content div, and this is wrapped by a .dropdown-container div.
So something like:
I have event listeners for each dropdown-container, which will toggle visibility on clicking it. And I also have a general window event listener where if one clicks outside the .dropdown-containers, it gets rid of all the drop-downs.
I however have one peculiar issue which I can’t solve. If I click on Button1 which then shows its dropdown-content, and then I click on Button 2 - it will show both dropdown-contents. How could I get it to first close the Button 1 dropdown?