Solution using .textContent instead of .innerHTML

// 1. Create a multidimensional array to hold quiz questions and answers

const questions = [
  ["How many league championships have Manchester United won?", "20"],
  ["How many goals did Eric Cantona score for Manchester United?", "64"],
  ["Who is Manchester United's all-time leading goal scorer?", "Wayne Rooney"]
];

// 2. Store the number of questions answered correctly
let correctAnswers = 0;

// variable to store the current answer entered by user
let answer;
// create arrays to store the correct & incorrect questions separately
const correctQuestions = [];
const incorrectQuestions = [];

/* 
  3. Use a loop to cycle through each question
      - Present each question to the user
      - Compare the user's response to answer in the array
      - If the response matches the answer, the number of correctly
        answered questions increments by 1
*/

for (let i = 0; i < questions.length; i++) {
  answer = prompt(questions[i][0]).toUpperCase();
  // if the answer is correct, increment correctAnswers, and add the question to correctQuestions array
  if (answer === questions[i][1].toUpperCase()) {
    correctAnswers++;
    correctQuestions.push(questions[i][0]);
  }
  // if answer is wrong, add question to incorrectQuestions array
  else {
   incorrectQuestions.push(questions[i][0]); 
  }
}

// 4. Display the number of correct answers to the user

// parent div
// create a wrapper div and add it to the main section
let div = document.createElement('div');
document.querySelector('main').appendChild(div);

// create an element to display the number of correct questions answered, and append it to the page
let scoreDiv = document.createElement('h1');
if (correctAnswers == 1) {
  scoreDiv.textContent = `You answered ${correctAnswers} question correctly.`
} else {
  scoreDiv.textContent = `You answered ${correctAnswers} questions correctly.`
}
div.appendChild(scoreDiv);

// display which answers were correct and incorrect
// function for creating a title for each section listing either the correct or incorrect questions, and adding it to the page. Pass in the title we want
function createTitleElement(title) {
  // create a heading element, and add the title that we passed in. Then append it to the page in the wrapper
  let titleHeading = document.createElement('h2');
  titleHeading.textContent = title;
  div.appendChild(titleHeading);
}

// loop through arrays of correct and incorrect questions and display on page
// add an array of questions to loop through, and list to output the questions to
function addQuestionsList(arr) {
  // if the array is the correctQuestions, add this title
  if (arr === correctQuestions) {
    createTitleElement('You got these questions right:');
    // if not, add this title instead
  } else {
     createTitleElement('You got these questions wrong:');
  }
  // if the array is empty, add a <p> tag to say 'None'
  if (arr.length === 0) {
    let empty = document.createElement('p');
    empty.style.textAlign = 'left';
    empty.textContent = 'None.';
    div.appendChild(empty);
  } else {
    // if the array is not empty, add a list and loop through the array to add the questions to it
    // create the parent element for the list, & add it to page
    let displayQuestionsList = document.createElement('ol');
    div.appendChild(displayQuestionsList);
    // loop through the array, and add the questions to the list.
    for (let j = 0; j < arr.length; j++) {
      // create the list item for the question
      let displayQuestion = document.createElement('li');
      displayQuestion.textContent = arr[j];
      // then add the list item to the <ol> parent
      displayQuestionsList.appendChild(displayQuestion);
    }
  }
}

// run the function for correct and incorrect questions arrays
addQuestionsList(correctQuestions);
addQuestionsList(incorrectQuestions);