$(document).ready(function(){

//RELEASE 0: 
  //Link this script and the jQuery library to the jquery_example.html file and analyze what this code does. 

$('body').css({'background-color': 'pink'})

//RELEASE 1:
  //Add code here to select elements of the DOM 
 var bodyElement = $('body')

//RELEASE 2: 
  // Add code here to modify the css and html of DOM elements
 $('h1').css({'color': 'blue'})
 $('h1').css({'border': 'blue'})
 $('h1').css({'visibility': 'hidden'})
 $('h1').css({'visibility': 'visible'})
 $('div.mascot h1').html('Fiddler Crab')


//RELEASE 3: Event Listener
  // Add the code for the event listener here 
 $('img').on('mouseover', function(e){
     e.preventDefault()
    $(this).attr('src', 'http://2.bp.blogspot.com/-JXdSrHoMR18/T9sxLkOJtkI/AAAAAAAAAZc/aNlkvHcZAso/s1600/fiddler-crab.jpg')
  })

  $('img').on('mouseleave', function(e){
     e.preventDefault()
    $(this).attr('src', 'http://socialtimes.com/files/2013/02/Dev-Bootcamp-logo.jpg')
  })


//RELEASE 4 : Experiment on your own
	$("div.mascot img").hover(function(){
	    $(this).filter(':not(:animated)').animate({ width: "200px" });
	}, function() {
	    $(this).animate({ width: "40%",
						  height: "40%",
						  border: "10px solid blue",
						  });
	});




})  // end of the document.ready function: do not remove or write DOM manipulation below this.