JavaScript changing inner HTML on events

[Saman]

Change text on click of a button

Code: Select all

<script type="text/javascript">
function changeText(){
    document.getElementById('myid1').innerHTML = 'ROBOT.LK Networks';
}
</script>
<p>Welcome to the site <b id='myid1'>Organisation Name</b> </p> 
<input type='button' onclick='changeText()' value='Change Text'/>

Replace user text on click of a button

Code: Select all

<script type="text/javascript">
function changeText2(){
    var userInput = document.getElementById('mytxt1').value;
    document.getElementById('myid2').innerHTML = userInput;
}
</script>
<p>Welcome to the site <b id='myid2'>Org name</b> </p> 
<input type='text' id='mytxt1' value='Enter Text Here' />
<input type='button' onclick='changeText2()' value='Change Text'/>

Changing HTML in a page dynamically on click of a button

Code: Select all

<script type="text/javascript">
function changeText3(){
    var oldHTML = document.getElementById('myid3').innerHTML;
    var newHTML = "<span style='color:#0000ff'>" + oldHTML + "</span>";
    document.getElementById('myid3').innerHTML = newHTML;
}
</script>
<p id='myid3'>Welcome to the site <b>ROBOT.LK Networks</b> </p> 
<input type='button' onclick='changeText3()' value='Change Text'/>