title: Insert same html into element multiple times with jQuery
body: <p>I want the user to click on a button and then have some html pop into an element. I did so and it works but it only works once. If they click the button again, nothing happens. I thought using empty() would fix the problem but it doesn't. What's wrong with my code.</p>
  
  <pre><code>&lt;script type="text/javascript" &gt;
  
  $(document).ready( function() {
  
     $('#button').on('click', function () {
  
       $('#ul').html('&lt;li&gt;testing testing&lt;/li&gt;').hide(1000, function() {
  
          $(this).empty();    
  
       });    
  
     });
  
  });
  
  &lt;/script&gt;
  
  &lt;input type="button" value="click me" id="button" /&gt;
  
  &lt;ul id="ul"&gt;
  
  &lt;/ul&gt;
  </code></pre>