jQueryでclassの追加・削除する方法

jQueryを使用して、classを追加したり、削除したりする方法を紹介します。
動的な部分や動きをつけるときにclassを付けたりすると簡単に実装できるので必ず覚えておきたいjQueryの１つです。

jQueryでCSSの追加・変更・削除やclass追加をする方法

では、早速ｊQueryを使用して動的にCSSの追加や削除を行ってみます。

指定の要素にclassを追加します。

$('要素').addClass('class名');

指定の要素にclassを削除します。

$('要素').removeClass('class名');

指定の要素に指定の要素に指定のclass名がついていれば削除、なければ追加する方法です。

$('要素').toggleClass('class名');

指定する要素に指定のclass名がついていれば削除、ない場合はclassを追加する方法です。

$('要素').click(function(){
  $(this).toggleClass('class名');
});