how to change a background of an element with mouseover

how to change a background of an element with mouseover

Hi all,

I'm a bit of a newbie to jQuery, and I am trying to basically change the background image of a div element containing a nav bar when a navigation link is hovered over. Here is my script:

  1.  $(function(){

            $("li#hover-first").mouseover(function(){
            $("div.nav").removeClass("nav").addClass("navbg");
            .mouseout(function(){$("div.nav").removeClass("navbg").addClass("nav");




  2. });
So the idea is, once the first li item is hovered over, the div with classname "nav" has it's class removed and has "navbg" added (which has the alternate background image).  Obviously this isn't working, so any help would be greatly appreciated...thanks.