Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

JavaScript JavaScript Loops, Arrays and Objects Tracking Multiple Items with Arrays Build a Quiz Challenge, Part 2 Solution

frits vd Velden
frits vd Velden
1,860 Points

Why won't my extra function given answers print and why are my right answers a list with bullets and the wrong with nr's

Why won't my extra function given answers print and why are my right answers a list with bullets and the wrong with numbers? Here is my code:

var correctAnswer = 0;

var questions = [
  ['How much is 10 + 10', '20'],
  ['What does John Snow know?', 'NOTHING'],
  ['Is a tomato a vegetable or a fruit', 'YES']
  ];

var question;
var answer;
var response;
var html;

var correct = [];
var wrong = [];

var yourAnswers = [];


function print(message) {
  var outputDiv = document.getElementById('output');
  outputDiv.innerHTML = message;
}


for (var i = 0; i < questions.length; i += 1) {
  question = questions[i][0];
  answer = questions[i][1];
  response = prompt(question.toUpperCase());
  if (response.toUpperCase() === answer) {
    correctAnswer += 1;
    // Goed antwoord tonen
    correct.push(question);
  } else {
    //Fout antwoord tonen
    wrong.push(question);
  }
}


function buildList (arr) {
 var listHTML = '<ol>';
 for (var i = 0; i < arr.length; i += 1) {
  listHTML += '<li>' + arr + '</li>';
 }
  listHTML += '</ol>';
  return listHTML;
}

function buildAnswersList (arr2) {
  if (response === true) {
    yourAnswers.push(answer);
  }
  var answerList = '<ol>';
  for (var i = 0; i < arr2.length; i += 1){
  answerList += '<li>' + arr2 + '</li>';
  }
  answerList += '</ol>'
  return answerList;
}


html = 'You got ' + correctAnswer + ' questions right';
html += '<h2>You got these correct</h2';
html += buildList(correct);
html += '<h2>You got these wrong</h2>';
html += buildList(wrong);
html += '<h2>Your answers were:</h2>';
html += buildAnswersList(yourAnswers);
print(html);

3 Answers

Steven Parker
Steven Parker
229,732 Points

The value of yourAnswers is never changed, so when you pass it to the final function it is still empty.

And the list formatting issues are caused by an incomplete tag:

html += '<h2>You got these correct</h2'; // note the ">" is missing from the end of the last tag
Steven Parker
Steven Parker
229,732 Points

In buildList, you have a reference to the array where you probably wanted a single element:

  listHTML += '<li>' + arr + '</li>';   // use "arr[i]" for an individual element

There's a similar issue in buildAnswersList. But you probably don't want to call it with response, since that's just the last answer given. For it to work, you'll need to build an array of answers while the questions are being asked, then you can pass that. There's some code that seems to be building such an array inside the function itself, but that's not the right place to do that job.

frits vd Velden
frits vd Velden
1,860 Points

Thanks Steven, that makes sense. I've changed it to this and it works a little bit better.

html += '<h2>Your answers were:</h2>';
html += buildAnswersList(response);

The other thing I don't get is that my final html looks like this:

JavaScript Quiz You got 2 questions right

You got these correct

  1. How much is 10 + 10,What does John Snow know?
  2. How much is 10 + 10,What does John Snow know?

You got these wrong

  1. Is a tomato a vegetable or a fruit

Your answers were:

  1. don't know
  2. don't know
  3. don't know
  4. don't know
  5. don't know

Why is it showing 5 answers (the 'Your answers were:' is random when I test it, sometimes it's more, sometimes it's less)] And why are the correct answers showing up double? Hope you or someone else can help out.

Thanks in advance.