'HTML text not changing when button pressed

I am trying to make text change to different text when a button is pressed and I'm not sure why it's not working.

<p id="test"> A </p>

<button onclick = "test()"> Click </button>

<script>
function test(){
     document.getElementById("test").innerHTML = "B";
}
</script>
javascripthtml


Solution 1:[1]

Use innerText insteadof innerHTML like this:

<p id="test"> A </p>

<button onclick = "test()"> Click </button>

<script>
function test(){
     document.getElementById("test").innerText = "B";
}
</script>

Solution 2:[2]

const button = document.querySelector('.test__button');

button.addEventListener("click", test)

function test() {
     document.getElementById("test").innerHTML = "B";
}
<p id="test"> A </p>

<button class="test__button"> Click </button>

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Nensi Gondaliya
Solution 2 ACCode

Related Questions