title: IF statement gives right value but wrong message
body: <p>I am making a quiz. When I click on the right answer for the first question, I get the "Correct" message and points added. On the other questions, when I click the right answer, it shows the "Wrong" message but it adds 10 points to the total. I don't understand why it adds the points in the IF statement, but I'm getting the wrong message.</p>
  
  <p>Here is my code:</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>const questions = [{
      question: "What's Beyonce's middle name?",
      answers: ["Maria", "Giselle"],
      correct: 'Giselle'
    },
    {
      question: "How many children does she have",
      answers: [1, 2, 3],
      correct: 3
    },
    {
      question: "What's Beyonce's husband name?",
      answers: ["Phil", "Greg", "Jay-Z"],
      correct: 'Jay-Z'
    },
    {
      question: "How old is Beyonce",
      answers: [34, 45, 27, 37],
      correct: 37
    }
  ]
  
  questions.map(question =&gt; {
    let quest = `
          &lt;p &gt;&lt;span class="number"&gt;&lt;/span&gt; ${question.question}&lt;/p&gt;
          `;
    document.querySelector('.question').insertAdjacentHTML('afterBegin', quest);
    question.answers.map(ans =&gt; {
      let answer = `
          &lt;ul class ="answers"&gt;
          &lt;li class="answer"&gt;${ans}&lt;/li&gt;
          &lt;/ul&gt;
          `;
      document.querySelector('p').insertAdjacentHTML('afterEnd', answer);
    })
  })
  
  let number = 0;
  document.querySelector('.score').textContent = number;
  questions.forEach(quest =&gt; {
    document.querySelector('.question').addEventListener('click', (e) =&gt; {
      if (e.target.className === 'answer') {
        if (e.target.innerText == quest.correct) {
          number += 10;
          document.querySelector('.score').textContent = number;
          document.querySelector('.message').textContent = 'Correct';
        } else {
          document.querySelector('.message').textContent = 'Wrong';
        }
      }
    })
  })</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;header&gt;
    &lt;h1&gt;Beehive Quiz&lt;/h1&gt;
    &lt;h1 class="score"&gt;&lt;/h1&gt;
    &lt;h4 class="message"&gt;&lt;/h4&gt;
  &lt;/header&gt;
  &lt;div class="container"&gt;
    &lt;div class="questions"&gt;
      &lt;h2&gt;On With The Questions...&lt;/h2&gt;
      &lt;div class="question"&gt;&lt;/div&gt;
    &lt;/div&gt;
  &lt;/div&gt;
  &lt;script src="app.js"&gt;&lt;/script&gt;</code></pre>
  </div>
  </div>
  </p>