title: jQuery selector doesn't update after dynamically adding new elements
body: <p>My selector is:</p>
  
  <pre><code>$('section#attendance input:last')
  </code></pre>
  
  <p>However, I append another input to section#attendance. I want the selector to now select that element (as it should, because of the <code>:last</code>. However, for some reason, it doesn't, and I'm not too sure why?</p>
  
  <p>Here's my full code:</p>
  
  <pre><code>$('section#attendance input:last').keydown(function(e) {
          if (e.which == 9)
          {
              var $this = $(this);
              var num = parseInt($this.attr('name').match(/\d+(,\d+)?/)[0]) + 1;
              $this.parent().append('&lt;input type="text" name="attendance[' + num +']" value="Name and Position" class="medium" /&gt;');
          }
      });
  </code></pre>
  
  <p>New Code:</p>
  
  <pre><code>    $("section#attendance").on("keydown", "input:last", function(e) {
      if (e.which == 9) {
          var $this = $(this);
          var num = parseInt($this.attr('name').match(/\d+(,\d+)?/)[0]) + 1;
          $this.after('&lt;input type="text" name="attendance[' + num +']" value="Name and Position" class="medium" /&gt;');
      }
  });
  </code></pre>
  
  <p>EDIT: The issue seems to be on the 'input:last', as it works if I just use input. Also, if I add class 'last' to the last element, it works when I use 'input.last' as a selector.</p>