jquery - divの最初のスパン要素を取得し、jQueryを使用してクラスを変更する方法

Question

スパンのあるdivがあります

<div id="div1">
    <span class="">hello</span>
</div>

divをクリックすると、divの最初のスパン要素のみのクラスを変更したい

$('#div1').click(function() {
    // ... check if first span element inside the div .. if there and change the class..    
});  

Answer 1

$('#div1').click(function() {    
   $('span:first', this).prop('class', 'newClassName');
})

http://api.jquery.com/first-selector/

http://jsfiddle.net/BUBb9/1/

Answer 2

使用する

 $("div span:first-child")

次のように：

$('#div1').click(function() {    
   $('span:first', this).prop('class', 'ClassName');
})

http://api.jquery.com/first-child-selector/を参照してください

Answer 3

$('#div1').click(function(){
    var v = $(this).find('span').text();
});

このように、スパンの値を取得できます。

.text（）メソッドの代わりに.html（）を使用することもできます。

Answer 4

複数の回答が有効です。私のアプローチ：

$('#div1').click(function() {    
     $(this).find('span').first().attr('class','newClassName');
});

Answer 5

$('#div1').click(function() {    
   $('#div1 span:first').attr('class', 'newClassName');
});