JQuery Tutorial

Define jQuery

How to use jQuery

jQuery Methods

Exercise Methods

jQuery Selectors

jQuery Events

Manipulate CSS Style

jQuery Traversing

jQuery Animations

jQuery AJAX

jQuery Plugins

jQuery Assignment

Manipulating CSS Classes

List some examples of appling CSS properties using jQuery.
$('element').css('property','value');
$('p').css('background-image', 'url("imgsrc.jpg")');
$('p').css('position', 'absolute');
$('p').css('background-color', 'yellow');
$('p').css('color', 'red' );
$('p').css('fontSize', '25px' );
$('p').css('font-size', '25px' );
$('p').css('border', '1px solid black');
$('p').css('width', '250px');
$('p').css('height', '250px');

jQuery addClass(), removeClass(), toggleClass()

The addclass() method is use to add one or more classes to the selected element. This method does not replace a class, it simply adds the class, appending it with the class which may already been assigned to the element. Syntax: $("p").addClass("myClass");

jQuery removeClass() method is use to remove a single class, multiple classes, or all classes from HTML element. Syntax: $("p").removeClass("myClass")

More than one class may be removed at a time, separated by a space, from the set of matched elements.


Set Multiple CSS Properties
$("element").css({"property1":"value1", "property2":"value2", ...});
$("p").css({"background-color": "yellow", "font-size": "200%"});

Add Multiple Classes

More than one class may be added at a time. To add multiple classes define class names separated by a space, to the elements, like: $("p").addClass("myClass1 myClass2");

Note: If a class name is included as a parameter, then only that class will be removed from the set of matched elements. If no class names are specified in the parameter, all classes will be removed.