Web Development with jQuery®

Manipulating Class Names (^) ❘ 99
table.johnLennonAlbums td {
padding: 3px;
border: 1px solid black;
}
table.johnLennonAlbums th {
text-align: left;
background: lightgreen;
}
table.johnLennonAlbums tbody tr:hover {
background: lightblue;
}
The various jQuery methods for working with class names are demonstrated in the following script:
$(document).ready(
function()
{
$('button#documentAddClass').click(
function(event)
{
event.preventDefault();
$('table').addClass('johnLennonAlbums');
}
);
$('button#documentHasClass').click(
function(event)
{
event.preventDefault();
if ($('table').hasClass('johnLennonAlbums'))
{
alert('The

has the class johnLennonAlbums');
}
else
{
alert('The does not have the class
johnLennonAlbums');
}
}
);
$('button#documentRemoveClass').click(
function(event)
{
event.preventDefault();
$('table').removeClass('johnLennonAlbums');
}
);
$('button#documentToggleClass').click(
function(event)
{
event.preventDefault();
http://www.it-ebooks.info