xxxxxxxxxx
// Get the element on which we want to set the innerHTML
const element = document.getElementById('elementId');
// Set the innerHTML of the element
element.innerHTML = 'New innerHTML value';
xxxxxxxxxx
// .innerHTML method is used to change the html contents of a DOM object
document.getElementById("demo").innerHTML = "Paragraph changed!";
xxxxxxxxxx
document.getElementById("Test").innerHTML = "<p style='color:red;'>Test</p>";
xxxxxxxxxx
// Try to use `textContent` instead of innerHTML as innerHTML can be hacked.
document.getElementById("myHeader").textContent = "Heading"
xxxxxxxxxx
var out = document.getElementById("out");
var res = out.innerHTML;
res = "foo";
xxxxxxxxxx
// Get the element you want to modify
const element = document.getElementById('myElement');
// Set the inner HTML content
element.innerHTML = 'New HTML content';
xxxxxxxxxx
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>innerText,value,innerHTML</title>
<link href="style.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="innerHTML"></div><br>
<input type="text" name="" id="value"><br>
<div id="innerText"></div>
<script>
//Using innerHTML
document.getElementById("innerHTML").innerHTML="<button>innerHTML</button>"
//It will add button in div#innerHTML
//Using innerText
document.getElementById("innerText").innerText="Text"
//It will add "Text" word in innerText
//Using value
document.getElementById("value").value="value"
//In input[text] box "value" will be already written when side will load
</script>
</body>
</html>