title: javascript - How to keep input data after page refresh
body: <p>I'm having some difficulty keeping different values ​​after refreshing the page. I found an old code on github and I wanted to modify it to make it better. In practice, the program creates a shopping list where I can highlight (if bought) or delete the inserted product but every time I refresh the page the values ​​entered disappear.</p>
  
  <p>This is the program: </p>
  
  <pre><code>$(document).ready(function() {
  
  var leftbutton = '&lt;img class="check" src="image/approve.png" alt="check" title="click to mark purchase" width="30px"&gt;'
  var rightbutton = '&lt;img class="close" src="image/close.png" alt="close" title="click to remove item" width="30px&gt;"&gt;'
  
  $('.textinput').keydown(function(a) {
      if (a.keyCode == 13) {
          $('.list').prepend('&lt;div class="result"&gt;' + leftbutton + '&lt;p&gt;' + $('.add-items').val() + '&lt;/p&gt;' + rightbutton + '&lt;/div&gt;');
      $('input.add-items').val("");
      }
  })
  
   $('.list').on('click', '.check', function() {
      if ($(this).closest('.list &gt; div').hasClass('result')) {
          $(this).closest('.list &gt; div').addClass( 'result-remove' );
          $(this).closest('.list &gt; div').removeClass( 'result' );
  
      }   
      else {
          $(this).closest('.list &gt; div').removeClass( 'result-remove' );
          $(this).closest('.list &gt; div').addClass( 'result' );
      }
      });
  
    $('.list').on('click', '.close', function() {
          $(this).closest('.list &gt; div').fadeOut("fast")
  
      });
  });
  </code></pre>