HTML DOM createElement() Method
HTML elements often contains text. To create a button with text, use
the innerText or
innerHTML properties of the element object:
Example
Create a button with text:
var btn = document.createElement("BUTTON"); // Create a <button> element
btn.innerHTML = "CLICK ME"; //
Insert text
document.body.appendChild(btn); // Append <button> to <body>
Try it Yourself »
More "Try it Yourself" examples below.
Definition and Usage
The createElement() method creates an Element Node with the specified name.
Tip: After the element is created, use the element.appendChild() or element.insertBefore() method to insert it to the document.
Browser Support
| Method | |||||
|---|---|---|---|---|---|
| createElement() | Yes | Yes | Yes | Yes | Yes |
Syntax
document.createElement(nodename)
Parameter Values
| Parameter | Type | Description |
|---|---|---|
| nodename | String | Required. The name of the element you want to create |
Technical Details
| Return Value: | An Element object, which represents the created Element node |
|---|---|
| DOM Version: | Core Level 1 Document Object |
More Examples
Example
Create a <p> element with some text, use
innerText to set the text, and append it to the document:
var para = document.createElement("P"); // Create a <p> element
para.innerText = "This is a paragraph"; //
Insert text
document.body.appendChild(para); // Append <p> to <body>
Try it Yourself »
Example
Create a <p> element and append it to a <div> element:
var para = document.createElement("P"); // Create a <p> element
para.innerHTML = "This is a paragraph."; //
Insert text
document.getElementById("myDIV").appendChild(para); // Append <p> to <div> with id="myDIV"
Try it Yourself »
