JSFiddle - React, Tailwind, and code Playground

by jairajdesai

HTML

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
<body>
  <h2>To Do</h2>
  <form name="checkListForm">
    <input type="text" name="checkListItem" />
    <button type="submit" id="button">Add!</button>
  </form>
  <br/>
  <div class="list"></div>
</body>

JavaScript

$(document).ready(function() {
  $('form[name=checkListForm]').on('submit', function() {
    // prevent the form from submitting
    event.preventDefault();
    var toAdd = $(this).find('input[name=checkListItem]').val();
    $('.list').append("<div class='item'>" + toAdd + "</div>")
    $('form :input').val('');
  });
});