Как лучше добавлять класс в div на чистом JavaScript?

Как лучше добавлять класс в div на чистом JavaScript (без jQuery)?

Ответ

Element.classList
Синтаксис
var elementClasses = elem.classList;
Методы
add( String [,String] ) Добавляет элементу указанные классы remove( String [,String] ) Удаляет у элемента указанные классы item ( Number ) Результат аналогичен вызову сlassList[Number] toggle ( String [, Boolean]) Если класс у элемента отсутствует - добавляет, иначе - убирает. Когда вторым параметром передано false - удаляет указанный класс, а если true - добавляет. Если вторым параметром передан undefined или переменная с typeof == 'undefined', поведение будет аналогичным передаче только первого параметра при вызове toggle. contains ( String ) Проверяет, есть ли данный класс у элемента (вернет true или false)
конечно же, у ClassList есть заветное свойство length, которое возвращает количество классов у элемента.
const elem = document.querySelector("#clock") //Выведем классы console.log(elem.classList); //DOMTokenList ["example", "for", "you"] //Добавим классы elem.classList.add("ok", "understand"); console.log(elem.classList); //DOMTokenList ["example", "for", "you", "ok", "understand"] //Переключим классы elem.classList.toggle("you"); elem.classList.toggle("he"); console.log(elem.classList); //DOMTokenList ["example", "for", "ok", "understand", "he"] //Проверим класс console.log(elem.classList.contains("example")); //true console.log(elem.classList.contains("lol")); //false //И удалим классы elem.classList.remove("example", "for", "understand", "he"); console.log(elem.classList); //DOMTokenList ["ok"]

*все взято из MDN кому не лень можно и здесь смотреть