HTML DOM innerHTML Property
Example
Change the HTML content of a <p> element with id="demo":
document.getElementById("demo").innerHTML = "Paragraph changed!";
Try it Yourself »
More "Try it Yourself" examples below.
Definition and Usage
The innerHTML property sets or returns the HTML content (inner HTML) of an element.
Browser Support
Property | |||||
---|---|---|---|---|---|
innerHTML | Yes | Yes | Yes | Yes | Yes |
Syntax
Return the innerHTML property:
HTMLElementObject.innerHTML
Set the innerHTML property:
HTMLElementObject.innerHTML = text
Property Values
Value | Description |
---|---|
text | Specifies the HTML content of an element |
Technical Details
Return Value: | A String, representing the HTML content of an element |
---|
More Examples
Example
Get the HTML content of a <p> element with id="myP":
var x = document.getElementById("myP").innerHTML;
Try it Yourself »
Example
Get the HTML content of a <ul> element with id="myList":
var x = document.getElementById("myList").innerHTML;
Try it Yourself »
Example
Change the HTML content of two elements:
document.getElementById("myP").innerHTML = "Hello Dolly.";
document.getElementById("myDIV").innerHTML = "How are you?";
Try it Yourself »
Example
Alert the HTML content of a <p> element with id="demo":
alert(document.getElementById("demo").innerHTML);
Try it Yourself »
Example
Delete the HTML content of a <p> element with id="demo":
document.getElementById("demo").innerHTML = ""; // Replaces the content of <p> with an empty string
Try it Yourself »
Example
Change the HTML content, URL, and target of a link:
document.getElementById("myAnchor").innerHTML = "W3Schools";
document.getElementById("myAnchor").href = "https://www.w3schools.com";
document.getElementById("myAnchor").target = "_blank";
Try it Yourself »
❮ Element Object