Style And Class

With JavaScript you can access and update an element’s style and even its class. Say that you have two CSS classes:

.warning {color: yellow;}
.error {color: green;}

You can update or switch an element’s CSS class with the following JavaScript code:

var element = document.getElementById('element');
element.className = 'warning';

But you can access individual CSS attributes via an element’s style object, such as

var element = document.getElementById('element');
element.style.color  = 'green';

Of course, you might update an element’s style based on some event or in conjunction of an Ajax call.

Related posts:

1. JavaScript FX
2. jQuery Library
3. Unobtrusive JavaScript with Prototype and Behavior
4. Dynamically Create HTML Elements with JavaScript
5. Twelve Elements of JavaScript Style