I am working on a Rock Paper Scissors game and I am having some trouble incrementing the score when a win condition is met.
this is my HTML score that I want to increment
<h1>you : <span id = "playerScore">0</span></h1>
let playersScore = document.getElementById('playerScore');
function playersChoosesRock(){
if (playersChoice == ' Rock ' && computerChoice == ' Paper '){
playersScore.innerHTML = ++;
console.log('YOU LOSE');
}
This is my javascript code the player selects Rock and the computer selects Paper I want to increment my 0 in the HTML if anyone can help it would be greatly appreciated.
This is the error that pops up when I attempt to make the innerHTML = '1'
Uncaught TypeError: Cannot set properties of null (setting 'innerHTML')
You cant assign innerHtml to an operator because it takes a value.
You can add a counter in your JS and pass its value to innerHtml or innerText.
Check this example :
index.html
<h1>you <span id="playerScore">0</span></h1>
<button id="button">click</button>
app.js
let playerScore = document.getElementById("playerScore");
let button = document.getElementById("button");
let score = 0;
playerScore.innerHTML = score;
button.addEventListener("click", () => {
score++;
playerScore.innerHTML = score;
});