0

I already have a button that sends an alert, but I want something like when the button is clicked the text changes to this but if its clicked again it changes it to a different thing and so on.

I tried to put a <var> in a <p> and the var was used in the JavaScript and went up each time the button was clicked and then in the js I wrote something like this.

if (number == 1) {
text = “don’t click that!”
//the number was the amount of times the button was clicked and the text was the text inside the <p>


var number

var button = document.createElement("button");
button.innerHTML = "Do Something";


var body = document.getElementsByTagName("body")[0];
body.appendChild(button);


button.addEventListener ("click", function() {
  alert("did something"),
  number = number + 1
});
body {
  padding: 20px;
}
button {
  margin-top: 20px;
  line-height: 60px;
  font-weight: bold;
  padding: 0 40px;
  background: salmon;
  border: none;
}
button:hover {
  background: lightsalmon;
}
isherwood
  • 58,414
  • 16
  • 114
  • 157
Coen McCall
  • 1
  • You need to reassign `button.innerHTML` when you click on it. `button.innerHTML = number`. – Barmar Feb 27 '23 at 17:06
  • Your question isn't clear, as you mention a paragraph element which is never presented. At any rate, the linked duplicates show how to update text in any element, really. – isherwood Feb 27 '23 at 17:12

0 Answers0