Неудобство классов в JavaScript

Пусть у нас есть несколько классов для стилизации сообщений:

css.success {
  color: green;
}
.warning {
  color: orange;
}
.error {
  color: red;
}

Пусть в некотором элементе мы вывели успешное сообщение и назначили ему соотвестсвующий класс для успеха:

javascriptelem.classList.add('success');

Пусть теперь мы в этом же элементе вывели сообщение об ошибке и назначили ему соотвестсвующий класс для ошибки:

javascriptelem.classList.add('error');

В результате получится, что в элементе будет два конфликтующих друг с другом класса:

html<div id="elem" class="success error">
  text
</div>

Получается, что перед добавлением нового класса, нам придется сначала удалить предыдущий:

javascriptelem.classList.remove('success');
elem.classList.add('error');

Это не очень удобно, так как мы можем не знать, какой именно был предыдущий класс и нам придется удалять все классы подряд:

javascriptelem.classList.remove('success');
elem.classList.remove('warning');
elem.classList.add('error');