Javascript DOM provides number of methods to append Div tag contents dynamically. In Javascript code you can use innerHTML, innerText or appendChild methods to append the Div HTML tag’s contents. Same Javascript DOM methods can be used to append the content of other HTML elements also. You can concatenate the previous content and new content dynamically using document object along with its method getElementById.

Javascript getElementById method allows you to access the properties of specified HTML tag through its id attribute value passed to the getElementById method.

Syntax for Javascript Append Div Contents Methods

document. getElementById("id") .innerText = "value";

document. getElementById("id") .innerHTML = "value";

document. getElementById("id") .appendChild( newChild );

Above syntax codes for Javascript Append Div element content shows the innerText property that allows you to add plain text to the specified div element. innerHTML property allows you to insert HTML tags along with plain text into the specified Div to append its content. Last method of appendChild allows you to append Div with new HTML child elements along with dynamic text.

Example of Javascript Append Div Contents

Above example will create a new HTML <div> tag along with innerHTML and nested HTML p tag having text. HTML <p> tag is inserted as child element using the appendChild method of Javascript.