Counter is badly incrementing (Javascript)

Question

I have a counter value which is not beign augmented as it should. This counter should be incremented after calling each newArea function. However, after calling the first function from the default value set on counter = 1, counter = 2 is done, but then after calling the second function the counter's value is suddenly 5.

Below is the source code. Thank you in advance for your help.

const home = document.querySelector("#home");
const nickName = document.querySelector(".nick-name");
const startBtn = document.querySelector(".startBtn");
const info = document.querySelector(".info");
let nickArea = document.querySelector(".nick-area");
let moneyArea = document.querySelector(".money-area");
const amountMoney = document.getElementById("amount-money");
const sendBtn = document.getElementById("send-money");
const infoWin = document.querySelector(".info-win");
const gameArea = document.getElementById("game-area");
const amoutWin = document.getElementById("amountwin");
let winArea = document.querySelector(".mywin");
const receive = document.getElementById("receive");
const area = document.querySelector(".area");
const endGameArea = document.getElementById("endgame");
const resetGame = document.getElementById("resetGame");
let currentFunds = 0;
let counter = 0;

//Investors
const InvestorNameArea = document.querySelector(".investor-name h2");
const InvestorPhotoArea = document.querySelector(".investor-image img");
const InvestorDealArea = document.querySelector(".investor-image p");
const Investors = [{name: "Bill Gates", photo: "img/investors/billgates.jpg", deal: "Lorem ipsum dolor sit amet consectetur adipisicing elit. Totam fuga quae asperiores nemo veritatis, cumque, nihil minus hic adipisci, ut dolor alias amet obcaecati. In ipsa tenetur laboriosam impedit. Consequatur!"}, {name: "Mark Zuckerberg", photo: "img/investors/markzuckerberg.jpg", deal: "Lorem ipsum dolor sit amet consectetur adipisicing elit. Totam fuga quae asperiores nemo veritatis, cumque, nihil minus hic adipisci, ut dolor alias amet obcaecati. In ipsa tenetur laboriosam impedit. Consequatur!"}, {name: "Google", photo: "img/investors/google.png", deal: "Lorem ipsum dolor sit amet consectetur adipisicing elit. Totam fuga quae asperiores nemo veritatis, cumque, nihil minus hic adipisci, ut dolor alias amet obcaecati. In ipsa tenetur laboriosam impedit. Consequatur!"}, {name: "Steve Jobs", photo: "img/investors/stevejobs.jpg", deal: "Lorem ipsum dolor sit amet consectetur adipisicing elit. Totam fuga quae asperiores nemo veritatis, cumque, nihil minus hic adipisci, ut dolor alias amet obcaecati. In ipsa tenetur laboriosam impedit. Consequatur!"}, {name: "Nokia", photo: "img/investors/nokia.jpg", deal: "Lorem ipsum dolor sit amet consectetur adipisicing elit. Totam fuga quae asperiores nemo veritatis, cumque, nihil minus hic adipisci, ut dolor alias amet obcaecati. In ipsa tenetur laboriosam impedit. Consequatur!"}];

    const endGame = (totalpayment,nick,currentFunds,payment) => {
    document.getElementById("totalearnings").innerHTML = `Total Earnings: ${totalpayment}$`;
    gameArea.style = "display: none";
    endGameArea.style = "display: inline-block";

    resetGame.addEventListener("click", function() {
        currentFunds = 0;
        payment = 0;
        counter = 0;
        newArea(nick, currentFunds, payment);
    })
}


        const newArea6 = (totalpayment, nick, currentFunds, payment) => {
            endGame(totalpayment, nick, currentFunds, payment);
        }


    const paymentMoney = (nick, currentFunds, payment) => {
    winArea.style = "display: none";
    let totalpayment = currentFunds + payment;
    moneyArea.innerHTML = `Your money: ${totalpayment}$`;
    if(totalpayment == 0) {
    endGame(totalpayment, nick, currentFunds, payment);
    }
    else {
       newArea(totalpayment, nick, currentFunds, payment);
    }

}

const sendMoney = (nick, currentFunds) => {
    infoWin.style = "display: none";
    if(amountMoney.value > currentFunds || amountMoney.value < 1) {
        infoWin.innerHTML = "You do not have that much money!";
        infoWin.style = "display: inline-block";
    }

    else {
        infoWin.style = "display: none";
        currentFunds = currentFunds - amountMoney.value;
        moneyArea.innerHTML = `Your money: ${currentFunds}$`;
        let rate = (Math.random() * (0 - 2) + 2).toFixed(1);
        let payment = Math.round(amountMoney.value * rate);
        amoutWin.innerHTML = `Investment: ${payment}$`;
        winArea.style = "display: inline-block";
        area.style = "display: none";
        receive.addEventListener("click", function() {
            paymentMoney(nick, currentFunds, payment, winArea);
        });
    }
}

const newArea = (nick) => {
    endGameArea.style = "display: none";
    endGameArea.style = "display: none";
    amountMoney.value = "";
    currentFunds = 100000;
    nickArea.innerHTML = `Your name: ${nick}`;
    moneyArea.innerHTML = `Your money: ${currentFunds}$`;
    InvestorNameArea.innerHTML = Investors[counter].name;
    InvestorPhotoArea.setAttribute("src", Investors[counter].photo);
    InvestorDealArea.innerHTML = Investors[counter].deal;
    winArea.style = "display: none";
    gameArea.style = "display: inline-block";
    area.style = "display: inline-block";
    sendBtn.addEventListener("click", function() {
        sendMoney(nick, currentFunds);
        counter++;
        console.log(counter);
    });
}

const startGame = () => {
    if(nickName.value.length < 1) {
        info.innerHTML = "You must write your name!";
        info.style = "opacity: 1";
    }

    else if(nickName.value.length > 15) {
        info.innerHTML = "Your name is too long!";
        info.style = "opacity: 1";
    }

    else {
        const nick = nickName.value;
        home.classList.add("hide");
        endGameArea.classList.add("hide");
        newArea(nick);
    }
}
startBtn.addEventListener("click", startGame);

Answer 1

Your counter variable will only be augmented when the #send-money button is clicked:

sendBtn.addEventListener("click", function() {
    sendMoney(nick, currentFunds);
    counter++;
    console.log(counter);
});

However, you have multiple click listeners attached to this button. Hence when you click on it, the counter will be incremented several times:

const newArea = (nick) => {
    endGameArea.style = "display: none";
    endGameArea.style = "display: none";
    ...
    sendBtn.addEventListener("click", function() {
        ...
    });
}

because newArea is being called several times as well.

Hope this helps