JavaScriptでHTML要素のクラスを追加・削除するにはclassListを使用する。
クラスの追加
■書き方
[取得した要素].classList.add('クラス名');
クラスの削除
■書き方
[取得した要素].classList.remove('クラス名');
クラスの有無で追加or削除
■書き方
[取得した要素].classList.toggle('クラス名');
サンプルコード
example.html
<div id="example" class="a"></div>
example.js
// 要素を取得
var example = document.getElementById('example');
// 'b' を追加
example.classList.add('b');
// 結果 <div id="example" class="a b"></div>
// 'a' を削除
example.classList.remove('a');
// 結果 <div id="example" class="b"></div>
// toggle 'c'
example.classList.toggle('c');
// 結果 <div id="example" class="b c"></div>
// toggle 'c'
example.classList.toggle('c');
// 結果 <div id="example" class="b"></div>