Ottenere genitore e primo figlio arco jQuery

Question

ho questa struttura:

<div class="list"> 
    <ul> 
     <li> 
      <span class="number">1</span> 
      <p class="list-title"><a href="#">Welcome</a></p> 
      <img src="images/like.png" class="like" /> 

      <div class="subcomments"> 
       <div class="comments"> 
       <ul> 
        <li> 
         <span class="number">2</span> 
         <img src="images/like.png" class="like" /> 
        </li> 
       </ul> 
      </div> 
     </div> 
    </li> 
</ul> 

E voglio quando clic sulla classe "come" viene visualizzato il contenuto di span.number, cioè va al padre e ottiene il contenuto dello span con il numero di classe.

sto cercando questo:

$('.like').parent().children('span:first').text() 

Ma mi dà sempre 1 nelle due situazioni, invece di dare 1 nel primo come, e 2 nel secondo come.

Answer 1

È necessario jquery siblings(),

Live Demo

$('.like').siblings('span:first').text(); 

Answer 2

si dovrebbe usare this

$(.link).click(function() { 
    $(this).parent().find('.number').text(); 
    // $(this).parent().find('span:first').text(); // same thing 
    // $(this).closest('.number').text();   // same thing 
}) 

quando basta scrivere $('.link').parent().find('span:first').text(); sempre ci vorrà prima classe .link e prendere il suo valore di span, quando si utilizza this utilizza esattamente questo .link che avete cliccato su

Answer 3

Uso .siblings():

$('.like').siblings('span:first').text(); 

Questo di per sé sarà sempre mostrare 1 - perché il selettore .like restituisce 2 elementi - con il seguente codice (.siblings('span:first').text();) in esecuzione contro il primo elemento entrambe le volte - è necessario utilizzare ognuno per ripetere ogni valore:

$('.like').each(function() { 
    alert($(this).siblings('span:first').text()); 
})​ 

Example here