title: Best way to store Local Storage?
body: <p>I've made a start to a to do list. I've got it adding an item when you submit an item.</p>
  
  <p>I want to now add local storage when you refresh the page so the items are saved in the browser.</p>
  
  <p>I obviously need to save all the times when the page is refreshed but because my items only update on click I'm not sure how to grab that function data outside the function and save the items.</p>
  
  <p>Any ideas?</p>
  
  <p>Cheers</p>
  
  <p>JS Fiddle: 
  <a href="https://jsfiddle.net/x1bj8mfp/" rel="nofollow noreferrer">https://jsfiddle.net/x1bj8mfp/</a></p>
  
  <pre><code>// When submit item
  var submit = document.getElementById('form');
  submit.addEventListener('submit', addItem);
  
  var items = [];
  
  var itemValues = document.getElementById('items');
  var listContainer = document.createElement('ul');
  itemValues.appendChild(listContainer);
  
  // Add item
  function addItem(e) {
      e.preventDefault();
      var item = this.querySelector('[name=item]');
      var itemValue = item.value;
      items.push(itemValue);
      item.value = '';
  
      // Output items
      var listItems = document.createElement('li');
      listItems.innerHTML = itemValue;
      listContainer.appendChild(listItems);
  }
  </code></pre>