javascript - Swap and save background color with jquery -

i have menu on every hover of links background color of page changes. now, let's default index.html color blue, , when hover on , contact have yellow , red. if click on page background color yellow, , if hover on home go blue. happens when mouseout page, background changed blue again, same if i'd hovered on contact.

here there's code in js

$(document).ready(function() {     $('#about').hover(function() {       $('body').css('background-color', 'yellow');     }, function() {       $('body').css('background', '');     });     $('#contact').hover(function() {       $('body').css('background-color', 'red');     }, function() {       $('body').css('background', '');     }); 

and here there menu

 <a id="about" href="about.html">about</a>  <a id="contact" href="contact.html">contact</a> 

i assume should check if current background color matches hovered one, on mouseout keep color, otherwise set initial one.

i'm not expert of js, when comes conditions. me out?

thanks!

if want color stay same after hovering, should remove second parameter of hover():

$(document).ready(function() {   $('#about').hover(function() {     $('body').css('background-color', 'yellow');   });   $('#contact').hover(function() {     $('body').css('background-color', 'red');   }); }); 

https://jsfiddle.net/as9jpopd/

** edit **

if want color change when user moves mouse on link , back, code should work, closing brackets missing:

$(document).ready(function() {   $('#about').hover(function() {     $('body').css('background-color', 'yellow');   }, function() {     $('body').css('background', '');   });   $('#contact').hover(function() {     $('body').css('background-color', 'red');   }, function() {     $('body').css('background', '');   }); });