title: How to correctly re-attach onclick events
body: <p>I have an OL that contains LIs with small inset buttons:</p>
  
  <pre><code>&lt;li id="123"&gt;
    &lt;button class="action1"&gt;Do 1&lt;/button&gt;
    &lt;button class="action2"&gt;Do 2&lt;/button&gt;
  &lt;/li&gt;
  </code></pre>
  
  <p>And my jquery which has set up the functions on document load:</p>
  
  <pre><code>$('.action1').on('click', function() {
    // do stuff
  });
  </code></pre>
  
  <p>Only, when I'm appending to the list:</p>
  
  <pre><code>li = '&lt;li...' //defines li item here
  $('#myol').append(li);
  </code></pre>
  
  <p>The buttons don't do anything. I guess this is because the listeners were attached before the listitem was created, but what is the correct way to attach the listeners to the newly created items (or even better, set them up in such a way that newly created items are accounted for?</p>