Disadvantage in using classes in JavaScript

Suppose we have several classes for styling messages:

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

Suppose we displayed a successful message in some element and assigned it the appropriate class for success:

javascriptelem.classList.add('success');

Let us now display an error message in the same element and assign it the appropriate class for an error:

javascriptelem.classList.add('error');

As a result, it will turn out that the element will have two classes that conflict with each other:

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

It turns out that before adding a new class, we will first have to remove the previous one:

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

This is not very convenient, since we may not know what the previous class was there and we will have to remove all classes in a row:

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