Question

I have a ul list and below im using jquery to find out if the user is hovering sub menus under about us and if yes set some css on hover. This does change the background color to green but when i hover off the green doesnt go away?

JQUERY

$('ul > li > ul > li a').hover(
    function(){
        var whatami = $(this).parents('li').eq(1).find('a[title]:first').attr('title');
        console.log(whatami);
        if (whatami == 'About Us') {
            //alert(whatami);
            $('.white ul.mega-menu li .sub-container.non-mega li a:hover').css({"background-color":"green"});

        }
    },
    function(){
    });

Answer 1

in jQuery the :hover is just an element selector, it’s not the same as CSS a:hover. Trying something like:

$('.white ul.mega-menu li .sub-container.non-mega li a').hover(
    function () {
        $(this).css({"background-color":"green"});
    },
    function () {
        $(this).css({"background-color":"none"});
    }
); ​