title: moving li from one ul to another jQuery
body: <p>I'm trying to move list items from one un-ordered list to another. This works fine the first time but once the items are moved I am unable to move them back. I made a fiddle to illustrate what i'm talking about. </p>
  
  <p>Check it out here -> <a href="http://jsfiddle.net/KjJCa/" rel="noreferrer">jsfiddle</a></p>
  
  <p><strong>HTML</strong></p>
  
  <pre><code>&lt;table&gt;
      &lt;tr&gt;
          &lt;td&gt;Numbers&lt;/td&gt;
          &lt;td&gt;Letters&lt;/td&gt;
      &lt;/tr&gt;
      &lt;tr&gt;
          &lt;td&gt;
              &lt;ul class='list1'&gt;
                  &lt;li&gt;1&lt;/li&gt;
                  &lt;li&gt;2&lt;/li&gt;
                  &lt;li&gt;3&lt;/li&gt;
                  &lt;li&gt;4&lt;/li&gt;
                  &lt;li&gt;5&lt;/li&gt;
              &lt;/ul&gt;
          &lt;/td&gt;
          &lt;td&gt;
              &lt;ul class='list2'&gt;
                  &lt;li&gt;a&lt;/li&gt;
                  &lt;li&gt;b&lt;/li&gt;
                  &lt;li&gt;c&lt;/li&gt;
                  &lt;li&gt;d&lt;/li&gt;
                  &lt;li&gt;e&lt;/li&gt;
              &lt;/ul&gt;
          &lt;/td&gt;
      &lt;/tr&gt;
  &lt;/table&gt;
  &lt;input type='button' value='&lt;&lt;' id='move_left' /&gt;
  &lt;input type='button' value='&gt;&gt;' id='move_right' /&gt;
  </code></pre>
  
  <p><strong>jQuery</strong></p>
  
  <pre><code>$('body').on('click', 'li', function() {
     $(this).toggleClass('selected');
  });
  
  $('#move_left').click(function() {
      $('.list1').append('&lt;li&gt;', $('.list2 .selected').text(), '&lt;/li&gt;');
      $('.list2 .selected').remove();
  });
  
  $('#move_right').click(function() {
      $('.list2').append('&lt;li&gt;', $('.list1 .selected').text(), '&lt;/li&gt;');
      $('.list1 .selected').remove();
  });
  </code></pre>
  
  <p><strong>CSS</strong></p>
  
  <pre><code>ul {
      list-style-type:none;
      padding:0px;
      margin:0px;
  }
  
  .selected {
      background-color:#efefef;
  }
  </code></pre>
  
  <p>As you can see the items move from left to right or right to left, yet once they are moved i am unable to move them back. Any help is appreciated.</p>