Use createElement and appendChild in HTML DOM (javascript) using a seperate JS file to create the following:
Question:
Use createElement and appendChild in HTML DOM (javascript) using a seperate JS file to create the following:
When the add ordered list button is clicked, an ordered list should be added to the empty div. Since the ordered list has no content, and to li elements, it will not show up on the web page.
Use Chrome Dev Tools -> Elements to ensure that an ol is being appended to the empty div.
My current HTML code is this:
<!DOCTYPE html>
<body>
<h2>Favorite Coffee Drinks</h2>
<input type="text" id="text">
<button id="btn1">Add Ordered List</button>
<script src=lab-week-8.js></script>
<div id="haha"></div>
</body>
</html>
.js file:
var main = function () {
//dispatch on button id
if (this.id == "btn1") {
//handle button 1
}
}
window.onload = function() {
var buttons = document.querySelectorAll("button");
for (var i = 0; i < buttons.length; ++i)
buttons[i].addEventListener("click", main);
}