Problème de déplacement jQuery

Question

Je suis confronté à un problème qui ne me semble pas juste. J'ai une paire de balises d'ancrage au même niveau dans le DOM. Structure ci-dessous:

div.mcoup 
    div.lcoup 
    div.rcoup 
     div.rcoupmeta 
      a.rcoupedit 
      a.rcoupdelete 
    div.updcoup 
    div.delcoup 

Et voici le script J'utilise:

$('div.delcoup').hide(); 
    $('a.rcoupdel').click(function() { 
     $(this).parent().parent().next('div.delcoup').slideToggle(400); 
     $('div.updcoup').slideUp(400); 
     $('div.crecoup').slideUp(400); 
     return false; 
    }); 

    $('div.updcoup').hide(); 
    $('a.rcoupedit').click(function() { 
     $(this).parent().parent().next('div.updcoup').slideToggle(400); 
     $('div.delcoup').slideUp(400); 
     $('div.crecoup').slideUp(400); 
     return false; 
    }); 

La chose étrange est la cible ici a.rcoupedit correctement et affecte tout en div.updcoup, avec le même code, a.rcoupdelete ne semble pas faire quoi que ce soit à div.delcoup. Il fait glisser les autres éléments cependant. Ma pensée était, à partir d'un.rcoupdelete nous devons monter deux niveaux puis trouver la prochaine div avec classe de delcoup. De toute évidence, quelque chose ne va pas.

Comment puis-je cibler correctement ce groupe div.delcoup?

Answer 1

.next() sélectionne spécifiquement l'élément suivant dans le DOM (au même niveau). La version .updcoup fonctionne correctement car, en effet, après avoir trouvé le parent du parent de l'ancre (c'est-à-dire, div.rcoup) l'élément .next() est div.updcoup.

Pour regarder à travers tous les les éléments qui viennent après l'sélectionné, utilisez .nextAll():

$(this).parent().parent().nextAll('div.delcoup').slideToggle(400);