When we assign ID for HTML entity for <p> tag or <div> tag, we can dynamically update its content.
The way of coding is super simple.
1) Assign ID for HTML entity
2) Put necessary action using getElementByID( entity_name ).innerHTML = blah blah...
Below example shows how to update internal content dynamically.
inner_html_demo.html
<html>
<!-- Programmed by Chun Kang -->
<head>
<title>Inner HTML Test 1</title>
</head>
<script>
function addContent(element_id, strContent)
{
document.getElementById( element_id).innerHTML += strContent;
}
function initContent(element_id)
{
document.getElementById( element_id).innerHTML ="";
}
</script>
<body>
<p id="test1">Initial content...</p>
<input type=button onclick="javascript:addContent('test1','<br>hello Venus!');" value="hello vinus"><br>
<input type=button onclick="javascript:addContent('test1','<br>hello Robo!');" value="hello robo"><br>
<input type=button onclick="javascript:initContent('test1');" value="!init"><br>
</body>
</html>