How to access newly created object's variable?

Question

So I have this blueprint object:

function User (theName, theEmail) {
  this.name = theName;
  this.email = theEmail;
  this.quizScores = [];
  this.currentScore = 0;
}

I create a new user like this var user1 = new User (theName.value, theEmail.value); which is inside a function for event listener when user types in his name and email. Now there are questions and a button for next question. Everytime user clicks next question button, I want to increment currentScore by one. Problem is that it stays 0 all the time. I do it like this:

scoretag = document.createElement("p"); scoretag.innerHTML = user1.currentScore; body.appendChild(scoretag);

Event listener and main loop:

for (var i = 0; i < theChoices[question1.theChoices].length; i++) {

    var arrayQ = document.createElement("p");
    arrayQ.innerHTML = theChoices[question1.theChoices][i];
    list.appendChild(arrayQ);

    var radio = document.createElement("input");
    radio.type = "radio";
    listOptions.appendChild(radio);

    dbtn.addEventListener("click", function() {
        //list.removeChild(arrayQ);
        //listOptions.removeChild
        list.removeChild(list.firstChild);
        list.removeChild(list.lastChild);
        user1.currentScore = user1.currentScore+1;
        scoretag = document.createElement("p");
        scoretag.innerHTML = user1.currentScore;
        body.appendChild(scoretag);

      })
  }

UPDATE: I putted the code for appending a child to a body element inside the loop after incrementation of score, but this results in many numbers printed on the page one after another.

But like I said, when I try t increment by one on button click, it still keeps showing 0 on the screen. Any help?

Answer 1

Every time you increment the score, you need to update the HTML element. This is an idea:

function User (theName, theEmail) {
  this.name = theName;
  this.email = theEmail;
  this.quizScores = [];
  this.currentScore = 0;
}
var user1 = new User ("aa","bb");

function updateScore(){
    user1.currentScore++;
    document.getElementById('score').innerText = user1.currentScore;
}

<button id="btn" onclick="updateScore()">next</button>
<p id="score">0</p>