Hi all, bit of a jquery rookie here trying to get something to work. Basically I have a div with a class "nav" and inside that div is a nav list. I want to change the background-image of "nav" when hovering over an item in the navlist, so I made this unsuccesful effort:

enter code here

$(function(){

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

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.