Same interaction not working across multiple collection lists

Having a bit of an issue on the page below where I’ve created an Interaction that’s triggered by a Div with the same class, but for some reason it will only work in 1 (of the 3) different collection lists.

I tried just creating different class names and interactions for each of the collection lists…but this causes issues with the Shopify Buy Button that’s embedded.

The interaction is only being created because I’ve added a Shopify Buy Button ABOVE the “+ Add To Cart” link text…and because of this, the hover for that Add to Cart text won’t work. So I had to create the interaction to where when you hover over the Embed code that it’s changes the text color of the Add to Cart button.

Anyone have a way to make this interaction work? Or is there a better way to implement this?

Thanks!

See the ‘Our Products’ page
Here is my public share link: LINK

Anyone have any experience with this? Any help would be greatly appreciated! Thanks

Was able to resolve this by changing the class of the button for each collection list and creating new interactions for each group with different names as well.