1function addItem(){
2 var ul = document.getElementById("dynamic-list");
3 var candidate = document.getElementById("candidate");
4 var li = document.createElement("li");
5 li.setAttribute('id',candidate.value);
6 li.appendChild(document.createTextNode(candidate.value));
7 ul.appendChild(li);
8}
9
10function removeItem(){
11 var ul = document.getElementById("dynamic-list");
12 var candidate = document.getElementById("candidate");
13 var item = document.getElementById(candidate.value);
14 ul.removeChild(item);
15}
1<!DOCTYPE html>
2<html lang="en">
3<head>
4 <meta charset="UTF-8">
5 <title>Dynamically add/remove items from list - JavaScript</title>
6</head>
7<body>
8
9 <ul id="dynamic-list"></ul>
10
11 <input type="text" id="candidate"/>
12 <button onclick="addItem()">add item</button>
13 <button onclick="removeItem()">remove item</button>
14
15 <script src="script.js"></script>
16</body>
17</html>