Search code examples
jqueryhtmlsiblings

jQuery: Finding a span inside a previous sibling anchor


I have the following html structure:

<div class="divClass">
     <a class="aClass" href="#">
          <img src="xxxx.jpg"
          <span class="span01">
              xxxx
          </span>                    
     </a> 
     <span class="span02">xxxx</span>
</div>

And I want to show span01 when hovering span02.

I'm trying to achieve this with jQuery: On hover, go to the previous <a>, look for the span with class .span01 and show it. This what I got, but I know I'm not using prevAll and :first like I'm supposed to, and I have no clue how to find span02 as it is not siblings with span01 (cause it's inside a different kind of element, an anchor):

$("span.span02").live("mouseenter", function () {
$('a.aClass').prevAll('.span:first').delay(300).fadeIn();
});

Solution

  • I'd just traverse to the parent and find it from there:

    $("span.postAuthorLabel").live("mouseenter", function() {
      $(this).parent().find('.span01').delay(300).fadeIn();
    });