element.innerHTML Get/set HTML content
Last updated: 2026-09-09
element.innerHTML Get/set HTML content
innerHTML gets or sets the HTML content of an element.
| Category | DOM |
|---|---|
| ES version | DOM |
📝 Syntax
el.innerHTML = '<p>New</p>';Returns：The HTML string.
Mutates the original：Yes (in place)
▶ Example
Edit the code, press Run, and see the result in the output panel:
Output：
(HTML content)⚠️ Warning innerHTML has XSS risk — use textContent for plain text.
💡 Tip innerHTML for batch HTML; textContent for text only.
🌐 Browser support
| Browser |  Chrome |
 Edge |
 Firefox |
 Safari |
 Opera |
|---|---|---|---|---|---|
| element.innerHTML | ✓ v1 | ✓ v12 | ✓ v1 | ✓ v1 | ✓ v1 |
| Supported by all modern browsers | |||||
🏷️ Related Items
💡 Related Cases
More case studies coming soon — check back later.
📚 Related Tutorials
❓ FAQ
QinnerHTML vs textContent?
AinnerHTML parses HTML; textContent is plain text only.
QWhat are the XSS risks?
AUser HTML can inject scripts — use textContent or escape.
QDoes innerHTML affect event listeners?
AYes — setting innerHTML destroys child elements and their listeners.
