同じクラス名を持つ各divの個々のクラスを選択する方法は？

Question

私はselect（クラス名を選択）をクリックします。それから、クラス名（increase_div）を持つすべてのdivの幅を増やします。しかし、selectクラスをクリックすると、inner divクラス名（increase_div）を持つ個々のdivだけが増えます。クラス名（increase_div）を持つ他のdivを増やしません。 コードは次のとおりです。

<script type="text/javascript"> 
    $(function(){ 
     $(".select").click(function(){ 
      $(".select .increase_div").animate({width:"500px"},1000) 
     }) 
    }) 
</script> 

    <div class="select"> 

    <div class="increase_div" style="width:100px;height:100px;background:gray;"> 

    </div> 
</div> 
<hr> 
<div class="select"> 
    <div class="increase_div" style="width:100px;height:100px;background:gray;"> 

    </div> 
</div> 

Answer 1

使用this（それはイベントが添付された特定の要素を参照）のみ

$(".select").click(function() { 
    $(this).find(".increase_div").animate({width:"500px"}, 1000); 
// ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ 
});