JSFiddle - React, Tailwind, and code Playground

by gurvinder372

HTML

<div id="wrapper">
      <textarea id="textarea"></textarea>
      <button id="add">Add</button> 
      <button id="clear">Delete All</button>
</div>

<div id="list"></div>

JavaScript

$("#add").click(function() {
  var userList = escapeHtml($('#textarea').val());
   $('#textarea').val('');
   var newitem ='<p>'+ '*' +userList+'</p>';
   $('#list').append(newitem);

   var list=$("#list").html();
   localStorage.setItem('list', list);   
   return false;
});
 if (localStorage.getItem('list')) {
  $('#list').html(localStorage.getItem('list'));
}  
$('#clear').click(function() {
  window.localStorage.clear();
  window.location.reload();
  return false;
});

function escapeHtml(unsafe) {
    return unsafe
         .replace(/&/g, "&amp;")
         .replace(/</g, "&lt;")
         .replace(/>/g, "&gt;")
         .replace(/"/g, "&quot;")
         .replace(/'/g, "&#039;");
 }