JSFiddle - React, Tailwind, and code Playground
HTML
Wie heißt der Kaiser von
<input type="text" id="input_answer" value="" />
<input type="button" value="Prüfen" onClick="checkInput('input_answer','answer_div','china')"/>
<DIV id="answer_div"></DIV>
CSS
.wrong {
display: block;
color: red;
}
.correct {
display: block;
color: green;
}
#answer{
display:inline;
font-family:Arial,Sans-Serife;
}
JavaScript
function checkInput(elInput,elAnswer,strAnswer){
var eltarget = document.getElementById(elAnswer);
var elInput = document.getElementById(elInput);
if(elInput.value.toLowerCase() == strAnswer.toLowerCase()){
eltarget.innerText = "KORREKT";
eltarget.setAttribute("class","correct");
}else{
eltarget.innerText = "FALSCH";
eltarget.setAttribute("class","wrong");
}
}