jQuery toggleClass() Method

Last Updated Jul 21, 2015, 12:00:06 PM

jQuery toggleClass() Method

jQuery toggleClass() method is used to add or remove more than one specific class to the each element present in the set of matched elements.


This method accepts one or more class names as a parameter. In which, if an element already has the class in the similar element, then it will remove the element, or if an item doesn’t have the class then it only adds the element to the DOM.


jQuery toggleClass() method will add or remove the toggle effect to the above HTML paragraphs. In the first time when you click on the button it will add green color to the paragraphs, if you click the button second time it will remove the green color and make it default black

The above jquery toggleClass() method will produce the following output

jQuery toggleClass() method
Try It Now

jQuery DOM Reference

Other Advanced jQuery and DOM topics you might want to learn
jQuery Basic DOM Methods

jQuery DOM Removal

jQuery DOM Insertion Inside

jQuery DOM Insertion Outside

jQuery DOM Insertion Around

Sources and Credits

The content and methods in the tutorial has been referred and updated with jQuery API and The jQuery Foundation

Last Updated Jul 21, 2015, 12:00:06 PM