Change HTML text on button click | Calling javascript variable in html | print javascript variable in html

Sometime we need to change HTML elements or any text on click event in javascript. Here we'll see how to change the text in html on click of button.

When user clicks on button changeText() function executed.

We can change the text using id which should be unique at particular HTML page.

<script>
function changeText()
{
var item = 'test';
document.getElementById("testid").innerHTML ='test';
}
</script>
<div id="testid">Text</div>
<input type="button" value="Change Text" onclick="changeText()">

function changeText()

{

var item = 'test';

document.getElementById("testid").innerHTML ='test';

}

</script>

We also can do the same through the class name property.

<script>
function changeText()
{
var item = 'test';
document.getElementByClassName("testid").innerHTML ='test';
}
</script>
<div class="testid">Text</div>
<input type="button" value="Change Text" onclick="changeText()">