Problema di classe selezione utilizzando jQuery

Question

Sono stato sbattere la testa contro un muro cercando fare questo lavoro per un po 'di tempo. Sto cercando di accorciare il commento corpo a una riga per compatto commento anteprima. Sto usando jQuery .each funzione per passare attraverso ogni .cbody (commento del corpo) nel mio sistema di commenti filettato e posizionarlo nella div CShort all'interno chead. Dovrebbe funzionare, ma i cant selezionare la classe CShort nella riga superiore. Qualsiasi aiuto è bene accetto. Per quanto posso vedere il mio jQuery dovrebbe essere questo:

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

Questo è il codice HTML per il commento:

<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

padre del cbody sembra non avere fratelli, quindi il bit

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

non restituisce nulla, è più probabile vuole sia

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

o

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

per ottenere la maggior parte direttamente al CShort, utilizzare

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

Modifica:

gerarchia del tuo codice HTML simile a questo:

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

• $(this) riferisce al cbody
• $(this).parent() si riferisce a div # 23
• $(this).parent().siblings() restituisce tutti gli altri nodi figlio del li (vuoto nel caso del codice di esempio)
• $(this).siblings() riferisce a div.chead, e un elementi poche a

poiché chead è un fratello di cbody, il modo migliore per scegliere è con

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

Answer 2

Prova a cambiare questo:

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

a questo:

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

.chead e .cbody sono fratelli, quindi non c'è bisogno di guardare genitore .cbody. Inoltre, .cshort è un bambino di .chead, in modo da guardare attraverso i figli di .chead, non a suoi fratelli (via .next).

Answer 3

Non dovrebbe essere che l'ultimo metodo append?

.html (str) sarà la sua sostituzione ogni volta, e vi ritroverete solo con l'ultimo.