Récupérer les élements frères du grand-père d'un élément

LeoLB
Javascript

Hey ... bonjour tout le monde !
Je viens tout juste de commencer à utiliser JQuery mais je sèches un peu pour parcourir le DOM de ma page avec JQuery . Je m'explique... par défault, dans mon système de messagerie, les réponses des messages (.container_reponse) ne sont pas affichés ! C'est en cliquant sur .button_reponse que l'on peut les afficher! Mais je n'arrive pas à faire fonctionner mon système !

.container_reponse{
   display:none;
}

<article class="container_message">
  <div>blablabla</div>
  <footer>
    <div class="button_reponse">2 réponses</div>          
  </footer>
  <div class="container_reponse">
    <div class="reponse">reponse1</div>
    <div class="reponse">reponse2</div>
  </div>
</article>  
<article class="container_message">
  <div>blablabla</div>
  <footer>
    <div class="button_reponse">2 réponses</div>          
  </footer>
  <div class="container_reponse">
    <div class="reponse">reponse1</div>
    <div class="reponse">reponse2</div>
  </div>
</article>  
<article class="container_message">
  <div>blablabla</div>
  <footer>
    <div class="button_reponse">3 réponses</div>          
  </footer>
  <div class="container_reponse">
    <div class="reponse">reponse1</div>
    <div class="reponse">reponse2</div>
    <div class="reponse">reponse3</div>
  </div>
</article>

// Affiche les réponses d'un message
$(document).ready(function(){
    $('.button_reponse').click(function(){
        $(this).parent('.container_message').$('.container_reponse').delay(800).fadeIn(400);  
    });
});

Voilà, en espérant que vous réussirez à résoudre mon problème qui dois surement être très simple je pense !

1 réponse

djtec
Réponse acceptée

Et en fesant:

$(document).ready(function(){
    $('.button_reponse').click(function(){
        $(this).parents('.container_message').find('.container_reponse').delay(800).fadeIn(400);  
    });
});