I just started learning Javascript, but I really thought I knew this. I can't figure out why it won't work. I need it to insert "this text" formatted as a level 2 header into theDiv when the button is clicked. I've tried every way, even with a function. This example seems like the way it should work, but doesn't. I have to make this work with Javascript only, no JQuery - I don't know any yet.
<html>
<h1 id="header">Header in progress</h1>
<body>
<p>
<input type="button" id="theButton" value="click me!" onclick="document.getElementById('theDiv').innerHTML('This is new.')">
</p>
<h3><div id="theDiv"></div></h3>
</body>
</html>
I just started learning Javascript, but I really thought I knew this. I can't figure out why it won't work. I need it to insert "this text" formatted as a level 2 header into theDiv when the button is clicked. I've tried every way, even with a function. This example seems like the way it should work, but doesn't. I have to make this work with Javascript only, no JQuery - I don't know any yet.
<html>
<h1 id="header">Header in progress</h1>
<body>
<p>
<input type="button" id="theButton" value="click me!" onclick="document.getElementById('theDiv').innerHTML('This is new.')">
</p>
<h3><div id="theDiv"></div></h3>
</body>
</html>
3 Answers
Reset to default 3document.getElementById("theDiv").textContent = 'This is dynamically added text';
Use document.getElementById('theDiv').innerHTML = 'This is new.'
You need to pass id of div with in ''(quotes) and innerHTML is property not a function
Demo
first step: get your button, and your html elements. 2nd step : add click listener to the button 3th step: add text into your html element.
const btn = document.getElementById('theButton');
const myText = document.getElementById('theDiv');
btn.addEventListener('click', function(){
const myInsertText = 'Hello World !';
myText.innerHTML = myInsertText;
}); <button id='theButton'>bouton</button>
<p id="theDiv"></p>