I hope you can help me. I am making the game Rock, Paper, Scissors in JavaScript, and I am stuck. The problem is that I can’t make a loop work to allow me to play 5 rounds in the game, keep a round counter, and update the score. The game is for practicing DOM manipulation.

In the end, I would expect the program to give me the final score and a message to the user to notify if they have won or lost.

I am sharing my complete code with you, thank you very much for your help!

let humanScore = 0
let computerScore = 0
let rounds = 0;

const getComputerChoice = ()=> {
    const items = ["rock", "paper", "scissors"];
    const randomItems = items[(Math.floor(Math.random() * items.length))];
    return randomItems;
}

const getHumanChoice = ()=> {
    return new Promise((resolve) => {
        const rockSelection = document.querySelector("#rock");
        const paperSelection = document.querySelector("#paper");
        const scissorsSelection = document.querySelector("#scissors");
    
        rockSelection.addEventListener("click", ()=> {
            rockSelection.setAttribute("class", "animation");
           resolve("rock"), {once: true};
        });
    
        paperSelection.addEventListener("click", ()=> {
            paperSelection.setAttribute("class", "animation");
            resolve("paper"), {once: true};
        });
    
        scissorsSelection.addEventListener("click", ()=> {
            scissorsSelection.setAttribute("class", "animation");
            resolve("scissors"), {once: true};
        });
    });
}


const playRound = (humanChoice, computerChoice)=> {
    const textResponse = document.querySelector("#display");
    const para = document.createElement("p");
    para.classList.add("para");
    para.textContent = "";
    textResponse.appendChild(para);

    if(humanChoice == "rock" && computerChoice == "scissors") {
        para.textContent = `You win! ${humanChoice} ???? beats ${computerChoice} ✂️`;
        humanScore++;
    } else if (humanChoice == "scissors" && computerChoice == "paper") {
        para.textContent = `You win! ${humanChoice} ✂️ beats ${computerChoice} ????`;
        humanScore++;
    } else if (humanChoice == "paper" && computerChoice == "rock") {
        para.textContent = `You win! ${humanChoice} ???? beats ${computerChoice} ????`;
        humanScore++;
    } else if (humanChoice === computerChoice) {
        para.textContent = `You draw! ????. The computer choose ${computerChoice} too!`;
    } else {
        para.textContent = `You lose! ????. The computer choose ${computerChoice}`;
        computerScore++;
    }
}

const playGame = async ()=> {
    
    const humanChoice = await getHumanChoice();
    const computerChoice = getComputerChoice();

    playRound(humanChoice, computerChoice);

    const score = document.querySelector("#score");
    const newPara = document.createElement("p");
    newPara.classList.add("Score");
    newPara.textContent =`ROUND ${rounds}: You ${humanScore},
    The computer: ${computerScore}`;
    score.appendChild(newPara);

    if (rounds < 5) {
        const nextDiv = document.createElement("div");
        const nextRound = document.createElement("button");
        nextDiv.classList.add("nextDiv");
        nextRound.classList.add("button");
        nextRound.textContent = "Next round";
        newPara.appendChild(nextDiv);
        nextDiv.appendChild(nextRound);
    
        return new Promise((resolve) => {
            nextRound.addEventListener("click", () => {
                resolve();
            }, { once: true });
        });
    }
};

const loopRounds = async ()=> {
    while (rounds < 5) {
        rounds++;
        await playGame()
    } 

    const finalMessage = document.createElement("p");
    if (humanScore > computerScore) {
        finalMessage.textContent = "You are the best!";
    } else if ( humanScore < computerScore) {
        finalMessage.textContent = "You are the worst in the world!";
    } else {
        finalMessage.textContent = "It's a draw!"
    }

    document.querySelector("#score").appendChild(finalMessage);

}

loopRounds();