Nevýhody tříd v JavaScriptu

Předpokládejme, že máme několik tříd pro stylizaci zpráv:

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

Předpokládejme, že v určitém prvku jsme zobrazili úspěšnou zprávu a přiřadili jí příslušnou třídu pro úspěch:

javascriptelem.classList.add('success');

Předpokládejme nyní, že jsme ve stejném prvku zobrazili chybovou zprávu a přiřadili jí příslušnou třídu pro chybu:

javascriptelem.classList.add('error');

Výsledkem bude, že prvek bude mít dvě vzájemně konfliktní třídy:

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

Vychází to tak, že před přidáním nové třídy budeme muset nejprve odstranit tu předchozí:

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

To není příliš pohodlné, protože my nemusíme vědět, která přesně byla předchozí třída a budeme muset odstranit všechny třídy jednu po druhé:

javascriptelem.classList.remove('success');
elem.classList.remove('warning');
elem.classList.add('error');
Задание 1

Je dán input. Při ztrátě fokusu zkontrolujte, že bylo do něj zadáno maximálně 9 znaků. Pokud ano, obarvěte ohraničení inputu na zelenou, pokud ne - na červenou.