$(document).ready(function() {//$() constructs a new jQuery object
			 
			 //pretty popin
			 $("a[rel^='prettyPopin']").prettyPopin();
			 
			 $("a").click(function(event){//select all "a" elements. "click" is a method of the object and binds a click event to all selected elements
			   event.preventDefault();
			  // $(this).hide("slow"); 
			 });
			 
			 $("a.clear").click(function() {
			 	$("li:first,tr:first").removeClass("first");
			 });
			 
			 $("a.hideList").click(function(){
			 	$("a.showList").removeClass("normal");
				$(this).parent().slideUp("slow");
			 });
			 
			 $("a.showList").click(function() {
			 	var current = $(this).next();
				var style = current.css("display");
				$("a.showList span").text("click to expand");
				$("div.list").slideUp("slow"); //slide up visible the visible block first
				if ( style=="none" ) {
					current.slideDown("slow"); //as long as the current div isn't already visible, reveal it
					$(this).children("span").text("click to close");
				} else {
					current.slideUp("slow"); //otherwise slide it up
					$("a.showList span").text("click to expand");
				}
				
			 });
			 
			 $("ul li").click(function() { //selects the decendant of the ancestor, UL
			 	$(this).toggleClass("red");
			 });
			 
			 $("a.hltFirst").click(function() {
			 	$("ul li:first-child,table tr:first-child").toggleClass("first"); //toggle the "first" class when the link with class="hltFirst" is clicked
			 });
			 
			 //$("a[class*='List']").append("<span> (affects the list div) </span>"); //any <a> that has "List" somewhere in the class name
			 
			 $("div").click(function(){
				  if ( $(this).hasClass("protected") )
				  $(this).animate({ left: -5 }, 55)
						 .animate({ left: 5 }, 55)
						 .animate({ left: -5 }, 55)
						 .animate({ left: 5 }, 55)
					     .animate({ left: 0 }, 55);
			 });
			 
		});