How to detect a link within div in jQuery? -

if clicks on link within div class "foo" want list items within div show. how can this?

here's failed attempt:

   $('div > li').hide();    $('div.foo > a').click(function(event) {        $('div.foo > li').show();        event.preventdefault();    });   <ul>     <div class="foo">         <a href="#">animals +</a>         <li>cat</li>         <li>dog</li>         <li>rabbit</li>     </div> </ul> 

you have problem html.

it should this,

<div class="foo">           <a href="#">animals +</a>     <ul>        <li>cat</li>        <li>dog</li>        <li>rabbit</li>     </ul> </div> 

then in jquery, this,

$('div.foo > ul').hide(); $('div.foo > a').click(function(event) {    $(this).next('ul').show();    event.preventdefault(); }); 

here's fiddle, , try not forget putting inside ready handler

_{welcome stackoverflow.com
don't forget accept answer}