JSFiddle - React, Tailwind, and code Playground

by Sumit Patel

HTML

<form id="todoForm">
      <h1>To Do List:<h1>
        <input id="todoInput">
        <button type="button" onclick="todoList()">Add Item</button>
    </form>
    <ul id="todoList">
    </ul>

CSS

ul{
  list-style-type: none;
}

JavaScript

function todoList() {
      var item = document.getElementById('todoInput').value
      var text = document.createTextNode(item)
      var newItem = document.createElement("li")
      newItem.appendChild(text)
      var checkbox = document.createElement('input');
			checkbox.type = "checkbox";
			checkbox.name = "name";
			checkbox.value = "value";
			checkbox.id = "id";
			newItem.appendChild(checkbox);
     document.getElementById("todoList").appendChild(newItem)
    }