JSFiddle - React, Tailwind, and code Playground
HTML
<input placeholder="type 'hello'" id="test" type="text" />
<input type="submit" id="byBtn" value="Verifier" onclick="isCorrect()" />
CSS
input[type=text] {
padding: 2px;
border: 1px solid #CCC;
border-radius: 2px;
outline: none;
}
.correct {
background-color: #FF1199
}
.incorrect {
background-color: #555555
}
JavaScript
function isCorrect() {
var test = document.getElementById('test');
if (test.value === "hello") {
test.className = "correct";
return true;
} else {
test.className = "incorrect";
return false;
}
}