title: How do I remove element using .click and .remove in jQuery
body: <p>Here is the <a href="http://jsfiddle.net/rfK5a/2/" rel="nofollow">JSfiddle</a></p>
  
  <p>and here is my code.</p>
  
  <p><strong>HTML</strong></p>
  
  <pre><code>&lt;h2&gt;Todo List&lt;/h2&gt;
  &lt;div id='additem'&gt;
      &lt;input type='text' name='additem'/&gt;
      &lt;button&gt;Add Item&lt;/button&gt;
  &lt;/div&gt;
  &lt;div id='todolist'&gt;
      &lt;ol&gt;
      &lt;/ol&gt;
     &lt;!-- Add item from "additem" input field --&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p><strong>JS</strong></p>
  
  <pre><code>$(document).ready(function(){
      $('button').click(function(){
          var item = $('input[name=additem]').val();
          $('ol').append('&lt;li&gt;'+ item +' &lt;button id="remove"&gt;Remove&lt;/button&gt;&lt;/li&gt;');
      });
      $("#remove").click(function(){
         $(this).parent('li').remove();
      });
  
     });
  </code></pre>