Trouver élément suivant d'une classe spécifique à l'intérieur d'un parent jQuery

Question

Je donne les résultats suivants:

<div class="container"> 
Test 1 
<div class="child">Testing</div> 
</div> 

<div class="container"> 
Test 2 
<div class="child">Testing</div> 
</div> 

<div class="container"> 
Test 3 
<div class="child">Testing</div> 
</div> 

Je souhaite avoir l'enfant div dans les thats conteneurs survolaient pour afficher et masquer lorsque la souris a quitté le récipient .

J'ai actuellement:

 $('.container').hover(
      function() { 
       $(this).next('.child').show(); 
      }, 
      function() { 
       $(this).next('.child').hide(); 
      } 
     ); 

Cependant, il ne semble pas fonctionner. Tout conseil apprécié, merci.

Answer 1

find utilisation() au lieu de la prochaine car il est un élément enfant et non un frère un:

$('.container').hover(
     function() { 
      $(this).find('.child').show(); 
     }, 
     function() { 
      $(this).find('.child').hide(); 
     } 
    ); 

Answer 2

next() est pour les frères et sœurs, vous devez utiliser les enfants pour les enfants:) ...

$('.container').hover(
     function() { 
      $(this).children('.child').show(); 
     }, 
     function() { 
      $(this).children('.child').hide(); 
     } 
    );