title: To Do List using JQuery and LocalStorage
body: <p>Hi guys I'm trying to create a TODO list using JQuery and Local Storage.</p>
  
  <ol>
  <li>If the localstorage has values already, they should populate when
  the page loads (closing the window and reopening retains the
  "todo's")</li>
  <li>If an item already exists in the list, show a console message noting the    duplicate (using $.inArray)</li>
  <li>User should be able to add and remove items and have the changes save automatically (using splice)</li>
  </ol>
  
  <p>This is what I have so far:</p>
  
  <pre><code>&lt;body&gt;
    &lt;h1&gt;TODO List&lt;/h1&gt;
    &lt;input id="input" type="text"&gt;&lt;button id="add"&gt;Add&lt;/button&gt;
    &lt;ul id="list"&gt;&lt;/ul&gt;
  &lt;/body&gt;
  
  &lt;script src="http://code.jquery.com/jquery-2.1.3.min.js"&gt;&lt;/script&gt;
  &lt;script&gt;
  if(window.localStorage !== undefined){
  var storeData = { };
  var input = $("#input").val();
  $("#add").click(function (){
    localStorage.setItem("input", JSON.stringify(input));
  });
  };
  
  $(document).ready(function(){
    var data = JSON.parse(localStorage.getItem("storeData"));
    $("#list").html(data);
  });
  &lt;/script&gt;
  </code></pre>
  
  <p>Is something wrong in the code? How can I add the splice and check duplicates using $.inArray? Thanks.</p>