jQuery - Get and Set CSS Classes
The style of element may be easily handled using jQuery.
jQuery Manipulating CSS
jQuery offers several manipulation techniques for CSS. The following approaches will be examined :
addClass()
- The selected items are adds one or more CSS classes.removeClass()
- Deletes one or more CSS classes from the components chosen.toggleClass()
- Add/delete the CSS classes from the chosen components.css()
- Thestyle
property is set or returned.
Example Stylesheet
All of the examples on this page will make use of the following stylesheet :
.important {
font-weight: bold;
font-size: xx-large;
}
.blue {
color: blue;
}
Related Links
jQuery addClass() and removeClass() Methods
The addClass()
is used add or insert CSS classes to an specified or multiple HTML elements.
The removeClass()
is used remove or delete CSS classes from an specified or multiple HTML elements.
Example:- This example illustrates how class attributes may be added or removed from/to various components. Of course, when you add classes, you can pick several elements :
This is heading 1
This is heading 2
This is heading 3
Output :-
This is heading 1
This is heading 2
This is heading 3
Related Links
jQuery toggleClass() Method
The toggleClass()
function is a combination of addClass()
and
removeClass()
.
Example :- The toggleClass()
function in jQuery is demonstrated in the following example. This function allows you to add/remove classes from the items you've chosen :
This is a paragraph.
Output :-
This is a paragraph.