How to add color to WC Ajax Product Filter?

Question

JavaScript

Initially, in this filter, the color is displayed in words. But I need to have color instead of words. (I need this plugin).
Here is how I solved this issue on jquery:

var name_color = $('#wcapf-attribute-filter-7 a').text();
var name = $('#wcapf-attribute-filter-7 a');

        $(name).on('click', function () {
            $(this).css('box-shadow', '0px 0px 7px 0px rgba(0,0,0,0.25');
        });

        $(name).each(function(){
            if (name_color == 'Черный') {
                $(name).addClass('black');
            }
        });

I am looking for a color by name and assigning a css class. Clicking on a color adds a shadow to it. But the problem is that the shadow and fill disappear as soon as the goods are sorted. How to fix it?

Answer 1

Your script fires after the DOM is loaded
After the ajax filter is reloaded as it is, the event no longer fires. You need to add an event so that js will fire after each ajax.