How to change element value at runtime at button click event in Javascript?
Javascript is most widely used scripting language.
It is easy to understand and use. It is very powerful language.
It also supports object- oriented as well as structured programming language. JavaScript makes a distinction between expressions and statements.
Description: Please one button "Click me to change element values" add function chgElements() which is written in Javascript. this function is used to change element value at runtime. Initially value of first element is "This is element one" but when you click the button you will find "An element one has been changed at runtime" as a value of element one.
The argument required for getElementById requires id of the HTML element you wish to use.
<!DOCTYPE html>
<html>
<body>
<h1>Element change example.</h1>
<p id="elementone">This is element one.</p>
<div id="elementtwo">This is element two.</div>
<p>
<button type="button" onclick="chgElements()">Click me to change element values</button>
</p>
<script>
function chgElements()
{
document.getElementById("elementone").innerHTML="An element one has been changed at runtime";
document.getElementById("elementtwo").innerHTML="An element two has been changed at runtime";
}
</script>
<p>When you click on "Click me to change element values", the value of two elements will change.</p>
</body>
</html>