Bueno necesito hacer un trivia, ya estuve investigando mucho y la verdad no se como hacer que se seleccione un array después de acabar la sentencia if - else. Así que opté por usar una variable. Les paso el código HTML para que se den una idea. Y el JavaScript que estoy intentando hacer. Quiero que me muestre la palabra CORRECTO o INCORRECTO y al hacer click vaya a la siguiente pregunta.
Código HTML:
<section>
<article style="display:block" id="q1">Question 1
<ul class="ans">
<li><label><input name="q1" value="0" type="radio" onclick="answer();">Norma</label></li>
<li><label><input name="q1" value="1" type="radio" onclick="answer();">Liliana</label></li>
<li><label><input name="q1" value="2" type="radio" onclick="answer();">Las dos</label></li>
</ul>
</article>
<article style="display:none" id="q2">Question 2
<ul class="ans">
<li><label><input name="q2" value="0" type="radio" onclick="answer();" >Norma</label></li>
<li><label><input name="q2" value="1" type="radio" onclick="answer();" >Liliana</label></li>
<li><label><input name="q2" value="2" type="radio" onclick="answer();">Las dos</label></li>
</ul>
</article>
<article style="display:none" id="q3">Question 3
<ul class="ans">
<li><label><input name="q3" value="0" type="radio" onclick="answer();" >Norma</label></li>
<li><label><input name="q3" value="1" type="radio" onclick="answer();" >Liliana</label></li>
<li><label><input name="q3" value="2" type="radio" onclick="answer();" >Las dos</label></li>
</ul>
</article>
<article style="display:none" id="q4">Question 4
<ul class="ans">
<li><label><input name="q4" value="0" type="radio" onclick="answer();" >Norma</label></li>
<li><label><input name="q4" value="1" type="radio" onclick="answer();" >Liliana</label></li>
<li><label><input name="q4" value="2" type="radio" onclick="answer();" >Las dos</label></li>
</ul>
</article>
<article style="display:none" id="q5">Question 5
<ul class="ans" >
<li><label><input name="q5" value="0" type="radio" onclick="answer();" >Norma</label></li>
<li><label><input name="q5" value="1" type="radio" onclick="answer();" >Liliana</label></li>
<li><label><input name="q5" value="2" type="radio" onclick="answer();" >Las dos</label></li>
</ul>
</article>
<input type="submit" value="Siguiente" onclick="send();">
</section>
Código:
function answer(){
var x = document.getElementsByName("q1", "q2", "q3", "q4", "q5");
var answer;
for (var i = 0; i < x.length; i++) {
if (x[i].checked === true) {
answer = x[i].value;
break
}
}
if (document.getElementsByName("q1")){
if (answer == 0) {
var a = document.getElementsByTagName("article")[0];
a.innerHTML = "CORRECTO";
}else{
var a = document.getElementsByTagName("article")[0];
a.innerHTML = "INCORRECTO";
}
}
if (document.getElementsByName("q2")){
if (answer == 1) {
var a = document.getElementsByTagName("article")[0];
a.innerHTML = "CORRECTO";
}else{
var a = document.getElementsByTagName("article")[0];
a.innerHTML = "INCORRECTO";
}
}
}
var counter = 0;
function send(){
if (counter == 0){
document.getElementById("q1").style.display = "none";
document.getElementById("q2").style.display = "block";
counter = 1;
}else if (counter == 1){
document.getElementById("q2").style.display = "none";
document.getElementById("q3").style.display = "block";
counter = 2;
}else if (counter == 2){
document.getElementById("q3").style.display = "none";
document.getElementById("q4").style.display = "block";
counter = 3;
}else if (counter == 3){
document.getElementById("q4").style.display = "none";
document.getElementById("q5").style.display = "block";
counter = 4;
}
}