JavaScriptにおけるCSSクラスを使用したスタイリングの利点

スタイルを直接変更する代わりにクラスを使用することには、さらにもう一つの利点があります。手を軽く動かすだけで、要素のスタイルを交互に切り替えることができます。

例えば、段落を初めてクリックしたときに特定の色に変え、もう一度クリックしたときに元の色に戻すようにすることができます。そのためには、単にメソッドaddをメソッドtoggleに変えるだけです：

let elems = document.querySelectorAll('p');

for (let elem of elems) {
	elem.addEventListener('click', function() {
		this.classList.toggle('colored');
	});
}

前の課題を修正して、ボタンを再度押すと、そのボタンの動作がキャンセルされるようにしてください。