jQueryとJavaScriptでクラス属性の書き方を比較してみました。
JSでもかなりシンプルに指定可能です。
取得
let cls1=$('#foo').attr('class');
let el=document.querySelector('#foo');
//以下、3つの方法で取得可能
let cls1=el.getAttribute('class');
let cls2=el.className;
let cls3=el.classList.value;
追加
$('#foo').addClass('bar');
$('#foo').addClass('baz qux'); //複数追加
let el=document.querySelector('#foo');
el.classList.add('bar');
el.classList.add('bar','qux'); //複数追加
削除
$('#foo').removeClass('bar');
$('#foo').removeClass('baz qux'); //複数削除
let el=document.querySelector('#foo');
el.classList.remove('bar');
el.classList.remove('bar','qux'); //複数削除
切り替え(指定したclassがあれば削除、なければ追加)
$('#foo').toggleClass('bar');
$('#foo').toggleClass('baz qux'); //複数指定
let el=document.querySelector('#foo');
el.classList.toggle('bar');
el.classList.toggle('bar','qux'); //複数指定
存在有無を確認
$('#foo').hasClass('bar');
$('#foo').hasClass('baz qux'); //複数指定
let el=document.querySelector('#foo');
el.classList.contains('bar');
el.classList.contains('bar','qux'); //複数指定