title: jquery .on('click', func) function not doing its job
body: <p>How to create the issue:</p>
  
  <ol>
  <li>click on existing trigger links - something happens (pass)</li>
  <li>click on the "add trigger" button, which appends a new trigger link w/ same class</li>
  <li>click on the newly created link, and it does not do the same thing as the 1st 2 links that existed from the start (fail)</li>
  </ol>
  
  <p>Here is my example -: <a href="http://jsbin.com/equjig/3/edit" rel="noreferrer">http://jsbin.com/equjig/3/edit</a></p>
  
  <p>I thought the <code>.on('click', func)</code> function was good for adding events to current elements in the dom, but also for future elements that get added to the dom?</p>
  
  <p>Here is my current javascript :</p>
  
  <pre><code>$(document).ready(function() {
    $(".link").on('click', function(e) {
      e.preventDefault();
      $("#out").append("clicked&lt;br/&gt;");
    });
  
    $("#b1").on('click', function() {
      $("#p1").append("&lt;a href='#' class='link'&gt;new trigger&lt;/a&gt;");
    });
  </code></pre>
  
  <p>here is the HTML</p>
  
  <pre><code>&lt;button type="button" id="b1"&gt;add trigger&lt;/button&gt;
    &lt;p id="p1"&gt;
      &lt;a href="#" class="link"&gt;trigger 1&lt;/a&gt;
      &lt;a href="#" class="link"&gt;trigger 2&lt;/a&gt;
    &lt;/p&gt;
    &lt;div id="out"&gt;&lt;/div&gt;
  </code></pre>
  
  <p>Note - im using jQuery 1.7 </p>
  
  <p>Thanks!</p>