Question

I have this jQuery snippet:

$(function() {
        $("ul > li").hover(function() {
          $(this).find("ul").stop(true, true).animate({opacity: 'toggle'}, 'fast');
        });
    });

This opens every <ul> what’s inside in another <ul>, but I want to make this only for
:

<div id="header"></div>

EDIT

Here is the structure, I modified it a bit, originally I want to add it to my header id but that’s better I think:

<ul id="navigation">
    <li>List item 1 
        <ul>
            <li>Sub List Item 1</li>
            <li>Sub List Item 2</li>
            <li>Sub List Item 3</li>
        </ul>
    </li>
    <li>List Item 2</li>
    <li>List Item 3</li>
</ul>

Please don’t eat me if the question is stupid I’m really really new in jQuery 🙂

Answer 1

Just change

$("ul > li")

To

$("#header ul > li")

This is going to limit the elements for the ones inside the header div.