Learning jQuery

The jQuery .css() method is an easy way to change the CSS of any HTML element, class, or ID without actually having to edit any of your stylesheets. The syntax for the .css() method is actually quite simple and somewhat similar to how your styles would appear in your stylesheets.

If you're using the .css() method to only add one new style rule to your HTML, the syntax should be like this:

$("element").css("property name", "property value");

If you're trying to change the styling of more to one element, the syntax will differ slightly:

$("element").css({"property name":"property value", "property name":"property value", "property name":"property value"});

In the example below, let's change the font-size and color of this header tag:

Here's the code:

$(document).ready(function(){
     $('h3').css({"font-size":"28px", "color":"#7fffd4"});
 })

The results should show an increased font-size and would change the color to a bright minty green, like this: