Onclick the text change the text

Onclick the text change the text content, This is one of the simple trick using javascript and html5.Using the the getElementById() method and innerHTML property we will done this.

The innerHTML property sets or returns the HTML Content of an element.The getElementById() method returns the element that has the ID attribute with the specified value.This method is one of the most common methods in the HTML DOM, and is used almost every time you want to manipulate, or get info from, an element on your document.

Returns null if no elements with the specified ID exists.An ID should be unique within a page. However, if more than one element with the specified ID exists, the getElementById() method returns the first element in the source code.

Onclick the text change the text

<div id="chgtext">This is my current text</div>
<a href="#" onclick="document.getElementById('chgtext').innerHTML='Change the text using javascript';">Change text</a> &nbsp; &nbsp;
<a href="#" onclick="document.getElementById('chgtext').innerHTML='Text will be changed based on the other text';">Change text2</a>&nbsp;  &nbsp;
<a href="#" onclick="document.getElementById('chgtext').innerHTML='This is another sample changed text on click the onther text';">Change text3</a>&nbsp;  &nbsp;
</div>