Question

I need to build a list-menu with a hover effect. I want to toggle a class containnig several other classes. This generally works, but I have the problem that the toggle-effect is switching the class on all list items in my list menu and not only on the one I select by hovering.

I made a fiddle to show you.

JS fiddle

$(document).ready(function() {

    $("li a").hover(function() {
    $(".lvl3-hover").toggle();

})

});

Answer 1

You need to use .find() to filter only the elements that are under the one receiving the hover event:

$(document).ready(function() {
    $("li a").hover(function() {
        $(this).find(".lvl3-hover").toggle();
    });
});