別のクラスの特定のインスタンスにクラスを動的に追加する

Question

クラスの名前を変更しながら、別のクラスの特定のインスタンスにクラスを追加しようとしています。これは私が持っているコードです：

<fieldset class = "formEntry"></fieldset> 
<fieldset class = "formEntry"></fieldset> 
<fieldset class = "formEntry"></fieldset> 

と、これは所望の出力です：関数が実行される前に

for(var i = 0; i<3; i++){ 
      $('.formEntry')[i].addClass("form" + i); 
    } 

これはコードです。

<fieldset class = "formEntry form1"></fieldset> 
<fieldset class = "formEntry form2"></fieldset> 
<fieldset class = "formEntry form3"></fieldset> 

助けてください！

Answer 1

すべての要素をループするために.each()を使用し、.addClass()メソッドを使用してクラスを追加できます。

$(document).ready(function() { 
 
$(".formEntry").each(function(i) { 
 
     $(this).addClass("form" + (i+1)); 
 
    }) 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script> 
 
<fieldset class = "formEntry"></fieldset> 
 
<fieldset class = "formEntry"></fieldset> 
 
<fieldset class = "formEntry"></fieldset>

Answer 2

あなたはeachを使用する必要はありません。 addClassも同様に機能します。

$('formEntry').addClass(function(i) { return 'form' + (i+1) }) 

Answer 3

）あなたは（スライスを使用することができます...ループ内で動的に追加クラスの

jQuery(document).ready(function(){ 
 
    var i=1; 
 
jQuery('.formEntry').each(function(){ 
 
    
 
jQuery(this).addClass('form'+i); 
 
    i++; 
 
}); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 

 
<fieldset class = "formEntry"></fieldset> 
 
<fieldset class = "formEntry"></fieldset> 
 
<fieldset class = "formEntry"></fieldset>

Answer 4

を、このコードを使用します。

for(var i = 0; i < 3; ++i){ 
$('.formEntry').slice(i,(i + 1)).addClass("form" + i); 
} 

API JQuery