Create a Div

This JavaScript Reference section displays the code for an example program that shows how to create a div element and add it as a child element.

CreateDiv.html

<!DOCTYPE html>
<html>
<head>
    <title>XoaX.net's Javascript</title>
</head>
<body>
    <script type="text/javascript" src="CreateDiv.js"></script>
</body>
</html>

CreateDiv.js

var qBody = document.getElementsByTagName("body")[0];

var qNewDiv = document.createElement("div");
qNewDiv.style.backgroundColor = "#dddddd";
qNewDiv.style.border = "2px solid #808080";
qNewDiv.style.padding = "5px";
qNewDiv.style.width = "350px";
qNewDiv.style.height = "100px";
qNewDiv.style.margin = "5px";
qNewDiv.style.color = "#404040";
qNewDiv.innerHTML = "He has placed before you fire and water:<br />" +
"stretch out your hand for whichever you wish.<br />" +
"Before a man are life and death,<br />" +
"and whichever he chooses will be given to him.<br />" +
"(Sirach 15:16-17 RSVCE)";
qBody.appendChild(qNewDiv);

Core JavaScript

Create a Div

CreateDiv.html

CreateDiv.js

Output