CODEWITHSUNDEEP
jqueryhover
OllyBarca
OllyBarca

Reputation: 1531

Jquery hover to display child element

<div id="sidemenu">
<ul>
<li><table><tr><td><span>Welcome</span></td><td>&bull;</td></tr></table></li>
<li><table><tr><td><span>About</span></td><td>&bull;</td></tr></table></li>
<li><table><tr><td><span>Blog</span></td><td>&bull;</td></tr></table></li>
<li><table><tr><td><span>Contact</span></td><td>&bull;</td></tr></table></li>
</ul>
</div>

The following HTML displays a sidemenu with anchored links (i've simplified the code for the sake of this example). I am trying to make the span text display when hovering over each bullet point in the menu. Is there a way to hover over a bullet point and display the corresponding span tag within each li tag?

Upvotes: 1

Views: 502

Answers (1)

Rory McCrossan
Rory McCrossan

Reputation: 337550

You can use the hover function, try this:

$('#sidemenu li').hover(
    function() { $('span', $(this)).show(); },
    function() { $('span', $(this)).hide(); } 
);

Example fiddle

Upvotes: 1

Related Questions