Question

I have a simple CSS :not selector:

$('.UISelect.popover:not(.active)').click(function () {

    $(this).toggleClass('active');

});

A click adds the class .active to the .UISelect.popover:

<a class="UISelect popover active">jow</a>

The :not(.active) selector should prevent removing the .active on the second click.

---

However, the problem is that it toggles the .active class on every click. What am i doing wrong?

Answer 1

An easy way would be to just add the class, no matter whether or not it already has it. You don’t need to check whether it already has the class before adding it, jQuery checks for uniqueness for you.

$('.UISelect.popover').click(function () {
    $(this).addClass('active');
});