jQuery addClass With Examples

jQuery addClass function is used to add one or more specified classes to the matched DOM elements.

jQuery addClass

Here is a simple example showing usage of jQuery addClass() method. jQuery version used in example is 3.2.1.

In jQuery addClass function, we are adding classes “selected” and “highlight” to the element p:last.

Similarly we are adding class “highlight” to p:first. So when page loads, these classes are applied to the <p> first and last child and html is formatted.

The below image shows the jQuery addClass example HTML page output in browser.


jQuery addClass example for zebra stripes effect

We are using jQuery addClass() method to create zebra stripes effect in HTML table. The html code is given below.

Below image shows the jQuery addClass zebra effect output in browser.


In above html, we are adding “striped” class to every even child of the table row using condition table tr:nth-child(even) dynamically. That’s all about jQuery addClass method.

By admin

Leave a Reply

%d bloggers like this: