Problème de sélection de classe en utilisant jquery

Question

Je me suis cogné la tête contre un mur en essayant de faire ce travail depuis un moment maintenant. J'essaye de raccourcir le corps de commentaire à une ligne pour l'aperçu compact de commentaire. J'utilise la fonction jquery .each pour parcourir chaque .cbody (corps de commentaire) dans mon système de commentaires fileté et le placer dans le cshort div à l'intérieur de chead. Cela devrait fonctionner mais je ne peux pas sélectionner la classe cshort dans la ligne supérieure. Toute aide est très appréciée. Pour autant que je peux voir mon jquery devrait être ceci:

$('.cbody').each(function(Ind1){ 
     var str = $(this).text(); 
     $(this).parent().siblings('.chead').next('.cshort').html(str); 
    }); 
}); 

C'est le code html pour le commentaire:

<ul> 
<li> 
<div id="23"> 
<a name="23"> 
</a> 
<div class="chead"> 
<a href="#" class="unord"> 
<img src="images/plus.gif" border="0"> 
</a> 
<a href="userinfo.php?user=muuuuuuuu"> 
<img src="include/avatar/n.jpg" border="0"> 
</a> 
<span style="display: none;" class="uname"> 
usersname 
</span> 
&nbsp;, 

<span class="cshort"> 
</span> 
<span class="votes_up" id="votes_up23"> 
2 
</span> 
- 
<span class="votes_down" id="votes_down23"> 
0 
</span> 
<span class="vote_buttons" id="vote_buttons23"> 
<a href="javascript:;" class="vote_up" id="23"> 
</a> 
<a href="javascript:;" class="vote_down" id="23"> 
</a> 
</span> 
</div> 
<div class="cbody"> 
<br> 
The comment text funny lol 
</div> 
<a style="display: none;" href="#" class="reply" id="23"> 
Reply 
</a> 
<a style="display: none;" href="#21" class="cparent"> 
Parent 
</a> 
</div> 
</li> 
</ul> 

Answer 1

parent du cbody ne semble pas avoir frères et soeurs, de sorte que le peu

$(this).parent().siblings('.chead') 

est rien retournaient, vous voulez probablement soit

$(this).parent().find('.chead') 

ou

$(this).siblings('.chead') 

pour obtenir le plus directement à la CShort, utilisez

$(this).parent().find('.cshort') 

Edit:

la hiérarchie de votre HTML ressemble à ceci:

ul 
| li 
| | div#23 
| | | a 
| | | div.chead 
| | | div.cbody 
| | | ... 

• $(this) fait référence à la cbody
• $(this).parent() fait référence à div # 23
• $(this).parent().siblings() retourne tous les autres nœuds enfants du li (vide dans le cas de votre exemple de code)
• $(this).siblings() se réfère à div.chead, et quelques a éléments

depuis Chéad est un frère de cbody, la meilleure façon de le sélectionner est avec

$(this).siblings('.chead') 

Answer 2

Essayez de changer ceci:

$(this).parent().siblings('.chead').next('.cshort').html(str); 

à ceci:

$(this).siblings('.chead').children('.cshort').html(str); 

.chead et .cbody sont frères et sœurs, de sorte que vous n'avez pas besoin de regarder le parent de .cbody. En outre, .cshort est un enfant de .chead, donc vous regardez à travers les enfants .chead, pas à ses frères et sœurs (via .next).

Answer 3

Cette dernière méthode ne devrait-elle pas être ajoutée?

.html (str) le remplacera à chaque fois, et vous ne finirez qu'avec le dernier.