I have a problem with jQuery task: I'm trying to show '«' sign when rolling over a link. The problem is: only one link can be "rolled over" at a time, but the '«' is showing on all of them.
Here's the code:
$(".list td a").hover(
function() { $(".laquo").show(); },
function() { $(".laquo").hide(); }
);
So, as I understand, after rolling over an 'a' element inside '.list td' my class '.laquo' should be displayed. This is working just fine. But how do I tell jQuery to target only one 'a' at a time?
I've tried solution from similar question:
function() { $(".laquo", this).show(); },
but it's not working - '«' is not showing at all. What do I do wrong?
Edit with HTML:
<div class="list">
<table>
<tr>
<td class="left">1.</td>
<td>
<a href="index.html">Circles</a>
<span class="laquo" style="display:none;"> «</span>
</td>
</tr>
</table>
</div>
As you can see, '.laquo' is not a child of an 'a'. How do I select it then?
Aaaand, I got it :D. Just had to delete the 'a', so I'm selecting from 'td'.
Thanks for help everyone!
When the .laquo
is a child of the a
, use the current a
as context:
$(".laquo",this).show();
When not, we need to see the HTML for the related elements.