複数classの取得方法

質問

貴重な場を借りてご質問させていただきます。

<select id="second">
　<option value="1" class="c_1 c_2">タイトル</option>
</select>

$("#second").change(function(){
　var $thisVal = $(this).val();

　$("#second option").each(function(){
var secondClass = $(this).attr('class');
var secondVal = secondClass + '_' + $thisVal;
console.log(secondVal)
});
});
jqueryにて上記のclass、c_1とc_2の後にvalueの値をつけたいと思うのですが、
以下のようにしてconsoleで確認するとc_1 c_2_1となってしまい、
片方にしかつかないのですが、どちらともつくようにする方法がございましたら、
是非とも教えていただければと思います。
どうかよろしくお願いいたします。

回答No.1

t_ohta · ベストアンサー

こんな感じでしょうか。

$("#second").change(function(){
var $thisVal = $(this).val();
$("#second option").each(function(){
var secondClass = $(this).attr('class').split(" ");
for (i = 0; i < secondClass.length; i++) {
secondClass[i] = secondClass[i] + '_' + $thisVal;
}
var secondVal = secondClass.join(" ");
console.log(secondVal)
});
});

$(this).attr('class') の戻り値は　"c_1 c_2"　ですから、この文字列に　+ '_' + $thisVal　を行っても　"c_1 c_2_1"　になるだけです。