Manipulating and Accessing CSS Class Names & CSS Style

Manipulating and Accessing CSS Class Names :
jQuery allows you to easily add, remove, and toggle CSS classes, which comes in handy for a variety of practical
uses. Here are the different syntaxes for accomplishing this:

$("div").addClass("content"); // adds class "content" to all

elements
$("div").removeClass("content"); // removes class "content" from all

elements
$("div").toggleClass("content");// toggles the class "content" on all

elements (adds it if it doesn't exist, //and removes it if it does)

You can also check to see if a selected element has a particular CSS class, and then run some code if it does. You
would check this using an if statement. Here is an example:
if ($("#myElement").hasClass("content")) {
// do something here
}

You could also check a set of elements (instead of just one), and the result would return "true" if any one of the
elements contained the class.

Manipulating CSS Styles with jQuery:
CSS styles can be added to elements easily using jQuery, and it's done in a cross-browser fashion. Here are some
examples to demonstrate this:
$("p").css("width", "400px"); // adds a width to all paragraphs
$("#myElement").css("color", "blue") // makes text color blue on element #myElement
$("ul").css("border", "solid 1px #ccc") // adds a border to all lists

Posted in: jquery