How do you add pseudo classes to elements using jQuery?

Solution 1:

You can't force a certain pseudo-class to apply using jQuery. That's not how pseudo-classes (especially dynamic pseudo-classes) work, since they're designed to select based on information that cannot be expressed via the DOM (spec).

You have to specify another class to use, then add that class using jQuery instead. Something like this:

.element_class_name:hover, .element_class_name.jqhover {
    /* stuff here */
}

$(this).addClass("jqhover");

Alternatively you could hunt for the .element_class_name:hover rule and add that class using jQuery itself, without hardcoding it into your stylesheet. It's the same principle, though.

Solution 2:

I think there is no way to do that with jQuery or javascript.

You can find the same answer in these two questions:

1. setting-css-pseudo-class-rules-from-javascript
2. css-pseudo-classes-with-jquery