JavaScript getElementById innerHTML

In JavaScript method document.getElementById() is very useful for containing any element reference. We can handle the properties of element by having once the element's reference. In this example we have to show the use of innerHTML attribute property with getElementById() method. 

To show use of both we have created a simple HTML page into which we are going to add one select box with three of it's options. For this purpose we have added a button into the HTML page it calls the method addOptions() on the click event.

In the very first line of code we have held  the HTML code as a string format into a variable txtValue and in the second line of code we have first taken the "myDiv" element's reference and after having reference we will assign the value of variable "txtValue" into the myDiv's inner code with line :

Here is the full example HTML code as follows :

Output :

As soon as you will click on the "Add Option" button it will generate the HTML code and will add this code into the div with help of innerHTML attribute property.

Download Source Code