NOTE: As of July 12, 2009, this blog has been discontinued and replaced by the new Thought Delimited blog. All of the entries in this blog can be found there, along with new posts.
Changing Individual CSS Styles with jQuery
When I started using jQuery, I quickly learned about the "addClass" and "removeClass" core functions, which I could use instead of my library function:
$("#userProfile").removeClass("hideTextClass");
...So I continued with my routine of changing styles by changing classes, even though sometimes I only needed to change or remove a single style setting. No harm, no foul.
But changing classes wouldn't work for the wacky little project I've been working on recently: I needed to be able to change several styles for an HTML element individually, and writing a class to handle every permutation of the possible style combinations was impractical.
So I went to the jQuery web site, hopeful that the brilliant folks at jQuery had something that could help me out.
And they did: the "css" core function allows you to read or set any individual style or styles:
{
$("#userProfile").css("display","none");
$("#missionStatement").css({ fontSize:"24px", fontWeight:"bold" });
}
Have I mentioned that I love jQuery? :)
Thank you!
~ Jim Summer
~ Jacksonville, FL