document.getElementById("id1").innerHTML = "First Header"; Ever wonder how you could change the contents of an HTML element? However, using innerHTML requires some preparation if you want to be able to use it easily and reliably.

This code includes two functions and two buttons.

Here, we display whatever the user has entered into the input field. getElemtntById() function takes content based on the given id within it. You can use innerHTML to set content like this: In this syntax example, {ID of element} is the ID of an HTML element and {content} is the new content to go into the element. The innerHTML property can be used along with getElementById() within your JavaScript code to refer to an HTML element and change its contents. Report a Bug or Comment on This Lesson - Your input is what keeps Tizag improving with time! The document.getElementById() method returns the element of specified id.. When outputting plain text without HTML tags, it's usually more appropriate to use textContent rather than innerHTML. In the previous page, we have used document.form1.name.value to get the value of the input value. By changing an element's innerHTML after some user interaction, you can make much more interactive pages..