comment accéder balise span intérieure en jquery

Question

J'ai une structure HTML:

  <div class="mydiv">xx 
       <span>test1</span> 
       <span>test2</span> 
       <div class="inerdiv"> 
       <span>inner span</span> 
       </div> 
       </div> 
      <span>test3</span> 

Maintenant, je veux appliquer un style à la durée qui contient « durée intérieure ».

$(function() { 
     $(".mydiv").click(function() { 

      $(".mydiv").next().find("span").css("border", "1px solid yellow");//not working 
     }); 
    }); 

Quel devrait être le bon code?

Answer 1

Remplacer:

$(".mydiv").next().find("span").css("border", "1px solid yellow"); 

Avec:

$(".mydiv .innerdiv span").css("border", "1px solid yellow"); 

Je ne pense pas next() fait ce que vous pensez.

next() renvoie le frère immédiatement suivant de tous les éléments correspondants précédents.

le balisage:

<div class="hello">foo1</div><span>bar1</span> 
<div class="goodbye">foo2</div><span>bar2</span> 
<div class="hello">foo3</div><span>bar3</span> 

qui suit retourne les éléments de portée contenant bar1 et bar3:

$("div.hello").next() 

Par conséquent, il n'y a pas moyen d'obtenir la <div class="innerdiv"> du div extérieur en utilisant next(), puisqu'ils ne sont pas frères et soeurs.

Answer 2

$(function() { 
    $(".mydiv").click(function() { 

     $(".innerdiv span", this).css("border", "1px solid yellow"); 
    }); 
}); 

Answer 3

$ (.mydiv .inerdiv span:contains('inner span')).css("border", "1px solid yellow")