$(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 

$('h1').css({
  'color': 'blue',
  'border': '5px dotted yellow',
  'visibilty': 'visible'
})

//RELEASE 2: 
  // Add code here to modify the css and html of DOM elements

$('.mascot h1').html('Sea Lions')

//RELEASE 3: Event Listener
  // Add the code for the event listener here 

$('img').on('mouseover', function(e){
     e.preventDefault()
    $(this).attr('src', 'http://royshlee.com/img/sealion.jpg')
  })

$('img').on('mouseleave', function(e){
     e.preventDefault()
    $(this).attr('src', 'http://upload.wikimedia.org/wikipedia/en/a/a2/Sea_lion_head.jpg')
  })

//RELEASE 4 : Experiment on your own

$('img').css({
  'width': '500',
  'margin-left': '0'
})

$('img').click(function(){
  $('img').animate({ 'margin-left': '+=100px' }, 'slow' );
})


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