Color-Switch | Plugin for Color Sublime | Plugin library

First you execute a forEach on all elements in the document (selected by document.querySelectorAll('*')). There, you assign event listeners on elements selected by a common queries $("ul.colors .color1") and $("ul.colors .color2") (only if their computed styles accomplish some conditions). This way, each time user clicks on any $("ul.colors .color1") element, the event listener callback will be executed once for each element found in the first query document.querySelectorAll('*'). You probably don't want that.

I assume you want all elements in a page which matches some computed styles to change when the color picker changes its value.

First of all: once you change the color, the computed color will be different, so the condition matcher will change (and don't match anymore). So you want one of the next:

• Save/cache the affected elements (more efficient and less prone to errors)
• Automatically change the matching condition with the currently selected color

Then, this code may help with that: