Html help..

Salut, apelez la bunavointa voastra de a ma ajuta sa imi modific putin un cod in html... oricat am incercat nu reusesc... probabil ca mai trebuie si altceva inafara de html dar nu cred... idee este urmatoarea:

As vrea sa pot modifica acest cod ca atunci cand apesi pe verifica test si ai dat raspunsul corect. raspunsul tau sa fie cu bold si verde iar cand il dai pe cel gresit raspunsul tau sa fie cu bold si rosu, iar cel corect sa fie cu verde si bold.

<meta charset="utf-8" />
<title></title>
<style type="text/css">
#rightans{
color: #20DF07;
font: bold 13px/22px Georgia, serif;
}
#wrongans{
color: #FF0000;
font: bold 13px/22px Georgia, serif;
}
</style>
<script>
window.onerror = function (m, u, l) {
return true;
}

'use strict';
function validate() {
var radios = document.getElementById("quiz").getElementsByTagName("INPUT");
var labels = document.getElementsByTagName('LABEL');
//console.log(getKeys(radios));
var right = 0;
var wrong = 0;
for (var i = 0, len = radios.length; i < len; i++) {
if (radios[i].value == "x") {
if (radios[i].checked == true) {
right++;
labels[i].style.color = "#00FF00";
labels[i].id = "rightans";
} else {
wrong++;
labels[i].id = 'wrongans';
}
}
}
var pcnt = (30 * right / (wrong + right)).toFixed(1);
document.getElementById("score").innerHTML = 'Intrebari Corecte: ' + right + '<br/>Intrebari Gresite: ' + wrong + '<br/>Puncte obtinute: ' + pcnt ;
}
function clear() {
var radios = document.getElementById("quiz").getElementsByTagName("INPUT");
for (var i = 0, len = radios.length; i < len; i++) {
radios[i].checked = false;
if (radios[i].value == "x") {
radios[i].parentNode.parentNode.className = '';
}
}
document.getElementById("score").innerHTML = '';
}
</script>
<div id="quiz">
<h1></h1> <h2>Test Română AdP Fonetică 1 </h2>

<fieldset id="q1"><legend>Întrebarea numărul 1</legend><legend><b>Câte litere, câte sunete și ce fel de sunete sunt în cuvintele: <u>gestionar</u> și <u>iaurgiu</u>:</b></legend>
<label><input name="q1" type="radio" value="a" />a) 9lit și 8sunete: 3voc + 5cons + 1semivoc + 1lit. ajut.; 7lit și 6sunete: 4voc și 2cons + 1lit. ajut.</label><br/>
<label><input name="q1" type="radio" value="x" /> 9lit și 9sunete: 4voc + 5cons + 1lit. ajut.; 7lit și 7sunete: 3voc și 2cons + 2semivoc + 1lit. ajut.</label><br/>
<label><input name="q1" type="radio" value="c" />c) 9lit și 8sunete: 3voc + 4cons + 1semivoc + 1lit. ajut.; 7lit și 6sunete: 3voc și 2cons + 1 semivoc + 1lit. ajut.</label></fieldset>


<fieldset id="q2"><legend>Întrebarea numărul 2</legend><legend><b>Valorile literei <u>i</u> în cuvintele: Ici iarba crește în orice condiții., sunt, în ordine:</b></legend>
<label><input name="q2" type="radio" value="a" />a) vocală, vocală, semivocală, vocală, vocală, semivocală, vocală</label><br/>
<label><input name="q2" type="radio" value="b" /> vocală, literă ajutătoare, semivocală, vocală, vocală, semivocală, vocală</label><br/>
<label><input name="q2" type="radio" value="x" />c) vocală, literă ajutătoare, semivocală, i scurt, vocală, vocală, semivocală</label></fieldset>

<fieldset id="q3"><legend>Întrebarea numărul 3</legend><legend><b>Conține diftongi seria:</b></legend>
<label><input name="q3" type="radio" value="a" />a) aplicație, anii, situație, el</label><br/>
<label><input name="q3" type="radio" value="x" /> ultimii, tocmai, ea, ești</label><br/>
<label><input name="q3" type="radio" value="c" />c) eu, erau, obicei, aici</label></fieldset>

<fieldset id="q30"><legend>Întrebarea numărul 30</legend><legend><b>Conține diftongi cu cratimă enunțul: 1. S-a dat de-a dura; 2. Apa era într-un vas; 3. Nu știu ce-a făcut el; 4. Ne-am dus la film; 5. Ei și-au adus cărțile:</b></legend>
<label><input name="q30" type="radio" value="a" />a) 1, 2, 3</label><br/>
<label><input name="q30" type="radio" value="b" /> 1, 4, 5</label><br/>
<label><input name="q30" type="radio" value="x" />c) 1 și 4</label></fieldset>


</div>
<input id="btn" type="button" value="Verifica Raspunsurile" onclick="validate()" /><input id="btnclr" type="button" value="Repeta Testul" onclick="window.location.reload();" />
<h2 id="score">&nbsp; &nbsp; &nbsp;</h2>

As vrea sa pot modifica acest cod ca atunci cand apesi pe verifica test si ai dat raspunsul corect. raspunsul tau sa fie cu bold si verde iar cand il dai pe cel gresit raspunsul tau sa fie cu bold si rosu, iar cel corect sa fie cu verde si bold.

Edited by d3v1l500, 04 May 2017 - 19:02.

rapid asa:

if (radios[i].value == "x") {
labels[i].id = "rightans";
}
if (radios[i].checked == true) {
if (radios[i].value == "x") {
right++;
//labels[i].style.color = "#00FF00";
labels[i].id = "rightans";
}
else {
wrong++;
labels[i].id = 'wrongans';
}
}

abordarea nu e cea mai buna, oricine da testul se poate uita in sursa paginii si vede care sunt raspunsurile bune (cu value x)
nu mai zic ca ele sunt tot timpul in aceeasi ordine, ar trebui randomizate  - daca ai server php folosesti rand(1,3) ca sa aloci ordinea raspunsurilor

Multumesc mult, nu ma pricep in php .. de aia am incercat sa combin totul sa fie in html ...