Learn all about the jQuery function .addClass().
It’s important to note that this method does not replace a class. It simply adds the class, appending it to any which may already be assigned to the elements.
.addClass() method manipulates the
className property of the selected elements, not the
class attribute. Once the property is changed, it’s the browser that updates the attribute accordingly. An implication of this behavior is that this method only works for documents with HTML DOM semantics (e.g., not pure XML documents).
More than one class may be added at a time, separated by a space, to the set of matched elements, like so:
This method is often used with
.removeClass() to switch elements’ classes from one to another, like so:
noClass classes are removed from all paragraphs, while
yourClass is added.
As of jQuery 1.4, the
.addClass() method’s argument can receive a function.
Given an unordered list with two
<li> elements, this example adds the class "item-0" to the first
<li> and "item-1" to the second.