HTML JS
HOW TO ADD & REMOVE HTML LIST ITEMS IN JAVASCRIPT
1) CREATE LIST ITEM & APPEND
<ol id="demoA"> <li>Item</li> </ol>
// CREATE NEW LIST ITEM var li = document.createElement("li"); li.innerHTML = "New"; // APPEND TO LIST document.getElementById("demoA") .appendChild(li);
2) APPEND HTML STRING
document.getElementById("demoB") .innerHTML += "<li>New</li>";
<ol id="demoB"> <li>Item</li> </ol>
3) REMOVE ITEMS
<ol id="demoC"> <li>Item</li> <li>Item</li> <li>Item</li> </ol>
// GET LIST + ALL ITEMS var ol = document.getElementById ("demoC"); var all = document.querySelectorAll ("#demoC li"); // REMOVE ITEMS ol.removeChild(all[0]); ol.removeChild(all[1]); ol.removeChild(all[2]);