Как добавить в html-элемент несколько классов?

Чтобы добавить в html-элемент несколько классов, можно воспользоваться методом classList.add() у элемента. Этот метод может принимать любое количество параметров. Каждый из этих параметров должен быть строкой - это имя класса, которое нужно добавить:

// создаём новый элемент
const el = document.createElement('div');
// добавляем классы
el.classList.add('first', 'second');
// После всех изменений
el.className; // first second

Также можно добавлять классы отдельными вызовами метода:

// создаём новый элемент
const el = document.createElement('div');
// добавляем первый класс
el.classList.add('first');
// добавляем второй класс
el.classList.add('second');
// После всех изменений
el.className; // first second

Имена классов должны соответствовать правилам именования, то есть, например, не должны содержать пробельные символы. Такой код выдаст ошибку:

const el = document.createElement('div');
el.classList.add('first second'); // ошибка! Имя класса задано неверно

В особых случаях можно использовать className. Хоть он служит для этих же целей, но имеет некоторые особенности. Например, так мы добавим ряд классов описав их одной строкой.

document.body.className = 'page page--contact theme-light';

Каждый раз мы запиcываем новые значение в атрибут класса. Бывает удобно при создании элемента. Или, наоборот, можем быстро удалить все классы указав className = ''.

document.body.className = '' // удаляем все классы