Javascript quiz (allows user multiple attempts) -

i trying create multiple choice quiz. if user selects correct answer shown alert saying "correct" , quiz moves on next question. if user selects incorrect answer shown alert saying "incorrect". want quiz give user 1 last attempt before moving on next question. have tried using variable "tries" keep track of how many times user has attempted question. currently, code proceeds next question if user selects correct answer, if incorrect answer chosen, "incorrect" alert pops , quiz proceeds next question anyway.

i have external 2-d array stores questions , respective multiple-choices , solution.

renderquestion() takes corresponding choices each question , writes html display question webpage.

checkanswer() goes through each choice until finds choice user selected. if it's correct, increments correct counter , if it's incorrect want tell user "incorrect" , quiz give user 1 last attempt on question before proceeding next one.

here condensed version of q_list.js (where externalized 2-d array holding questions , multiple-choices):

******edit******

we trying include questions user has click on part of diagram answer right. quiz has both questions multiple-choice , questions present user diagram have click on part. there "mc" , "diagram" identifiers included each question in 2-d array distinguish type of question program handling. depending on type of question, program calls function handles multiple-choice questions , 1 handles diagram questions. right now, using image maps , sending alert depending on click. there way record user clicked (like set boolean flag selected = true; somewhere?) want have submit button user can select multiple areas of diagram , and click "submit" send answer.

note: sorry, don't know how attach img file code if try run it, won't work/ won't able see image we're trying work on question 4.

var questions = [

["mc", "a 25 year-old man named tommy football superstar. throughout football career, he’s had several concussions. on crisp fall eve, tommy rushes er after being checked opponent.  tommy presents aphasia, dilation of left pupil, , nausea. where’s damage in brain?", "right hemisphere occipital", "bilateral frontal lobe", "basal ganglia", "cerebellum", "b"],  ["mc", "a patient has trouble making decisions , refraining saying inappropriate comments. lesion located?", "occiptital lobe", "temporal cortex", "parietal cortex", "prefrontal cortex", "d"],  ["mc", "a patient has conduction aphasia. cannot produce appropriate responses heard communication, , has difficulty naming pictures , objects. lesion located?", "broca's area", "the arcuate fasiculus", "the primary auditory cortex", "wernicke's area", "b"],  ["diagram", "can click on ponytail?", "img/facesmall.png"] 

];

    <h2 id="test_status"></h2>     <div id="test"></div>      <script src="js/orgnervsysq_list.js"></script>     <script type="text/javascript">       var pos = 0, test, test_status, question, choice, choices, cha, chb, chc, chd, correct = 0;        var tries = 0; //keeps track of how many times student attempts problem       var type = ""; //type of question       function _(x) {         return document.getelementbyid(x);       }        function renderquestion() {         type = questions[pos][0];         console.log("type is: " + type);         if (type == "mc") {           console.log("mc case");           rendermcquestion();         } else if (type == "diagram") {           console.log("diagram case");           renderdiagram();         }       }       renderquestion();        //create multiple-choice function       function rendermcquestion() {         test = _("test");         if (pos >= questions.length) {           test.innerhtml = "<h2>you got "+correct+" of "+questions.length+" questions correct</h2>";           _("test_status").innerhtml = "homework completed";           pos = 0;           correct = 0;           return false;         }         _("test_status").innerhtml = "question " + (pos+1) + " of " + questions.length;         question = questions[pos][1];         cha = questions[pos][2];         chb = questions[pos][3];         chc = questions[pos][4];         chd = questions[pos][5];         test.innerhtml = "<h3>"+question+"</h3>";         test.innerhtml += "<input type='radio' name = 'choices' value='a'> "+cha+"<br>";         test.innerhtml += "<input type='radio' name = 'choices' value='b'> "+chb+"<br>";         test.innerhtml += "<input type='radio' name = 'choices' value='c'> "+chc+"<br>";         test.innerhtml += "<input type='radio' name = 'choices' value='d'> "+chd+"<br><br>";         test.innerhtml += "<button onclick='checkanswer()'>submit</button>";         console.log("current question = " + (pos+1));       }        //create diagram question       function renderdiagram() {         console.log("we're in renderdiagram");         _("test_status").innerhtml = "question " + (pos+1) + " of " + questions.length;         question = questions[pos][1];         test.innerhtml = "<h3>"+question+"</h3>";         test.innerhtml += "<img id = 'q_diagram' src =" + questions[pos][2] + " alt='sorry, not load image.' usemap = 'ponytail' usemap = 'frontalcortex' ></img>";         test.innerhtml += "<map name = 'ponytail'> <area shape='poly' coords='427,33, 456,12, 506,5, 573,38, 578,219, 576,330, 599,377, 618,517, 598,560, 539,446, 459,371, 467,290, 463,104, 423,26' alt='ponytail face' href='javascript: alert(\"yes can!\")'> <area shape = 'poly' coords='167,232, 116,193, 113,135, 162,84, 231,65, 324,74, 267,182' href='javascript: alert(\"no, idiot frontal cortex!\")'> ";       }        function checkanswer(){         choices = document.getelementsbyname("choices");//get choices         (var i=0; i<choices.length; i++) { //traverse through choices           if (choices[i].checked) {            //check choice student chose             choice = choices[i].value;         //set student's choice var choice             if (choice == questions[pos][6]) { //check if student's choice correct               alert("correct");               correct++;                 tries = 0;               pos++;                   } else if (choice != questions[pos][6] && tries < 1) {               tries++;               console.log("tries = " + tries);               alert("try again");               //need somehow display same question again              } else if (choice != question[pos][6] && tries >= 1) {               tries = 0;               pos++;               alert("incorrect");             }             renderquestion();           }         }       }       window.addeventlistener("load", rendermcquestion, false);     </script> 

the easiest solution question move pos++ instruction in first branch of if, executed when user chooses right solution, this:

if (choices[i].checked) {            //check choice student chose   choice = choices[i].value;         //set student's choice var choice   if (choice == questions[pos][5]) { //check if student's choice correct     alert("correct");     correct++;       tries = 0;     pos++;   } else if (choice != questions[pos][5] && tries < 1) {     tries++;     console.log("tries = " + tries);     alert("try again");     //need somehow display same question again   } else if (choice != question[pos][5] && tries >= 1) {     alert("incorrect");   }   renderquestion();       } 

in example set tries = 0 , pos++ without checking if answer right one, goes next question