for文でのaddEventListenerについて

実現したいこと

・for文を用いて、全ての要素にaddEventListenerを適用させたい。

###具体的な質問内容
javascriptでクリックしたら、デザインが変化する’お気に入り登録’ボタンを作成しています。全ての要素にaddEventListenerを適用させるため、for文を用いて以下のように実装しました。しかし、全ての要素に適用されるどころか、クリックしてもボタンのデザインが切り替わらず、上手く実行されませんでした。
どのように実装しますと上手く機能しますでしょうか。

該当のソースコード

var switchImg = document.getElementsByClassName("fav-btn")
for(var i=0;i<switchImg.length;i++){
switchImg[i].addEventListener("click",function(){
switchImg.classList.toggle("on_switch");

if(switchImg.innerHTML === 'お気に入り<br>解除'){
switchImg.innerHTML='お気に入りに<br>追加';
} else {
switchImg.innerHTML='お気に入り<br>解除'
}
})
};

コメントを投稿

0 コメント