JSFiddle - React, Tailwind, and code Playground

by Dilip Prajapati

HTML

<ul id="dynamic-list">
  <li>1</li>
</ul>

<input type="text" id="candidate"/>
<button onclick="addItem()">add item</button>
<button onclick="removeItem()">remove item</button>

JavaScript

function addItem(){
	var ul = document.getElementById("dynamic-list");
var candidate = document.getElementById("candidate");
  var li = document.createElement("li");
  /* li.setAttribute('id',candidate.value); */
  li.appendChild(document.createTextNode(candidate.value));
  ul.appendChild(li);
}

function removeItem(){
	var ul = document.getElementById("dynamic-list");
  var candidate = document.getElementById("candidate");
  var item = document.getElementById(candidate.value);
  ul.removeChild(item);
}