When the interpreter runs the line .innerHTML="LIVES: " + removeLives();
, removeLives
will be called, resulting in lives
being decremented and the new content there being lower.
Put that line inside the click handler instead, and initially populate the lives
div via the HTML.
Also, either use an inline handler in the HTML or .onclick
in the JS, but not both – preferably, avoid inline handlers, since they’re universally considered to be poor practice. To add the handler in the JS, make sure to use .onclick
, not .onClick
, it’s case sensitive.
You’ll also probably want to stop decrementing once lives
reaches 0.
var lives = 3;
document.getElementById("buttonA").onclick = function() {
lives--;
if (lives < 0) lives = 0;
document.getElementById("lives").innerHTML = "LIVES: " + lives;
};
<div id="lives">LIVES: 3</div>
<button id="buttonA">buttonA</button>
solved *SOLVED* How to execute a function after a button is clicked? [closed]