Dynamiczna zmiana koloru komunikatu błędu

Treść zadania

W formularzu mamy pole <input id="kodKuponu" value="PROMO">, przycisk <button id="btnKupon">Aktywuj</button> oraz akapit <p id="statusKuponu"></p>. Poprawny kod to START2026. Po kliknięciu przycisku:

Jeżeli kod jest błędny: ustaw tekst akapitu na Błędny kod kuponu! oraz jego kolor za pomocą status.style.color = "red";
Jeżeli kod jest poprawny: ustaw tekst Kupon zaakceptowany! oraz status.style.color = "green";

Co będzie oceniane

Porównanie wprowadzonego kodu ze stałą wartością.
Ustawienie stylu color na 'red' dla błędnego kodu.
Wpisanie Błędny kod kuponu! do akapitu.
Kod uruchamia się bez błędu i przechodzi wszystkie testy automatyczne.

Testy automatyczne (1)

Ustawienie błędu i czerwonego koloru — tekst #statusKuponu = Błędny kod kuponu!

Zaliczenie: wszystkie testy muszą przejść. Testy uruchamia się przyciskiem „Sprawdź testy” pod kodem.

// Zweryfikuj kupon i ustaw tekst oraz style.color akapitu #statusKuponu

Wskazówki

Wskazówka 1

Właściwość element.style.color pozwala na bezpośrednią modyfikację koloru czcionki z poziomu kodu JavaScript.

Wskazówka 2

W instrukcji if ... else porównaj wpisany kod z wymaganym wzorcem, ustawiając odpowiedni tekst i kolor.