$(document).ready(function() { alert('Welcome to StarTrackr! Now no longer under police …'); }); is same as ............ $(function() { alert('Ready to do your bidding!'); }); http://ajax.googleapis.com/ajax/libs/jquery/1.4.0/jquery.min.js

all select by type $('tr') $('p') $('div') $('h1') $('input') select by id $('#celebs') select by class $('.data') types inside id $('#celebs tr') span elements inside of p elements, which are themselves inside div elements—but only if those divs happen to have a class of fancy. $('div.fancy p span')

$(document).ready(function() { alert($('#celebs tr').length + ' elements!'); }); $(document).ready(function() { var fontSize = $('#celebs tbody tr:first').css('font-size'); alert(fontSize); }); alternate $('#celebs tbody tr:even').css( {'background-color': '#dddddd', 'color': '#666666'} ); addClass removeClass $('div').addClass('class_name'); $('div').addClass('class_name1 class_name2 class_name3'); $('#celebs tr.zebra').removeClass('zebra');

hide elament $('#hideButton').click(function() { $('#disclaimer').hide(); }); adding event handlers $('#hideButton').click(function() { $('#disclaimer').hide(); }); here in this is #hideButton $('#hideButton').click(function() { $(this).hide(); // a curious disappearing button. }); toggle a button $('#toggleButton').click(function() { if ($('#disclaimer').is(':visible')) { $('#disclaimer').hide(); } else { $('#disclaimer').show(); } });

Directly adding objects $(' opentag input type="button" value="toggle" id="toggleButton" closetag ') .insertAfter('#disclaimer'); $('#toggleButton').click(function() { $('#disclaimer').toggle(); }); directly removing objects $('#no-script').remove(); gracefully remove - fading $('#hideButton').click(function() { $('#disclaimer').fadeOut(); }); $('#dialog').dialog({ autoOpen: false, height: 280, modal: true, resizable: false, buttons: { Continue: function() { $(this).dialog('close'); // Submit Rating }, 'Change Rating': function() { $(this).dialog('close'); // Update Rating } } });