Неудобство от класовете в 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');
Задание 1

Даден е input. При загуба на фокус проверете, че в него са въведени не повече от 9-ти символа. Ако това е така, оцветете границата на input в зелено, а ако не е - в червено.