I am trying to figure out why, when I run this code, I am getting undefined for my correct answers.
$(document).ready (function () {
//
var answers =
[["Fee","Fi","Fo"],
["La","Dee","Da"]],
questions =
["Fee-ing?",
"La-ing?"],
corAns = ["Fee", "La"];
var counter = 0;
var $facts = $('#main_ .facts_div'),
$question = $facts.find('.question'),
$ul = $facts.find('ul'),
$btn = $('.myBtn');
$btn.on('click', function() {
if (counter < questions.length) {
$question.text(questions[counter]);
var ansstring = $.map(answers[counter], function(value) {
return '<li><input type="radio" name="ans" value="0"/>'
+ value + '</li>'}).join('');
$ul.html(ansstring);
var currentAnswers = $('input[name="ans"]:checked').map(function() {
return this.val();
}).get();
var correct = 0;
if (currentAnswers[counter]==corAns[counter]) {
correct++;
}
}
else {
$facts.text('You are done with the quiz ' + correct);
$(this).hide();
}
counter++;
});
//
});
It is quite long and I'm sorry about that, but I don't really know how tostrip it down.
I also realize this isn't the most elegant way to do this, but I just want to know why I can't seem to get my radio values.
I will add the markup as well if anyone wants.