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 trialAnastasios Poursaitedes
10,491 PointsAnother way to do the quiz. I'd appreciate feedback.
/* The function createList creates a list item with the answered question and appends it to the specified list */
function createList(list, question) {
let listItem = document.createElement('li');
listItem.textContent = question;
list.appendChild(listItem);
}
let questions = [
['How much is 3 * 9?', '27'],
['What is the name of the function that removes the last item in an array?', 'pop'],
['What is 2 + 2?', '4']
];
let correctAnswersHeading = document.createElement('h2');
let wrongAnswersHeading = document.createElement('h2');
let listOfCorrectAnswers = document.createElement('ol');
let listOfWrongAnswers = document.createElement('ol');
let outputDiv = document.querySelector('#output');
/* The for of loop iterates through the array and stores each item in the question variable */
/*In this case the question variable holds an array of the question and its answer*/
for (let question of questions) {
let answer;
/* If we keep giving no answer we will be prompted to answer again */
do {
answer = prompt(question[0]);
if (answer === '') { alert('You have to give an answer! Try again'); }
} while (answer === '');
/* If we answer correct we call the createList function
with the list that will hold the correct answers and
the question that we answered correctly
If not we call again the createList but this time with
the list of wrong answers.
*/
if (answer.toLowerCase() === question[1]) {
createList(listOfCorrectAnswers, question[0]);
} else {
createList(listOfWrongAnswers, question[0]);
}
}
correctAnswersHeading.textContent = listOfCorrectAnswers.childElementCount > 0 ? `${listOfCorrectAnswers.childElementCount} out of ${questions.length} answers were correct. Below are the questions that you answered correctly` : 'You have no correct answers';
wrongAnswersHeading.textContent = listOfWrongAnswers.childElementCount > 0 ? `${listOfWrongAnswers.childElementCount} out of ${questions.length} answers were wrong. Below are the questions that you did't give the correct answer` : 'You did not make a mistake. Well done.';
outputDiv.append(correctAnswersHeading, listOfCorrectAnswers, wrongAnswersHeading, listOfWrongAnswers);
I tried to make it as concise and brief as possible without sacrificing readability.