title: jQuery - Get id of element clicked in parent element
body: <p>Not sure how else to title this (what I titled it doesn't seem to make too much sense - fix it if you feel the need!).</p>
  
  <p>Anyway, I have a div that has some links and I need to get the id of the link that was clicked.</p>
  
  <p>HTML:</p>
  
  <pre><code>&lt;div id="pagination"&gt;
      &lt;br&gt;
      &lt;a href="#" id="firstPage"&gt;First Page&lt;/a&gt;&amp;nbsp;&amp;nbsp;|&amp;nbsp;&amp;nbsp;
      &lt;a href="#" id="prevPage"&gt;Prev Page&lt;/a&gt;&amp;nbsp;&amp;nbsp;|&amp;nbsp;&amp;nbsp;
      &lt;label id="currentPage"&gt;2&lt;/label&gt;&amp;nbsp;&amp;nbsp;|&amp;nbsp;&amp;nbsp;
      &lt;a href="#" id="nextPage"&gt;Next Page&lt;/a&gt;&amp;nbsp;&amp;nbsp;|&amp;nbsp;&amp;nbsp;
      &lt;a href="#" id="lastPage"&gt;Last Page&lt;/a&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>I tried to do it with this:</p>
  
  <pre><code>$('#pagination a').click(function() {
      console.log( $('#pagination a').index(this) );
  });
  </code></pre>
  
  <p>The #pagination div is dynamically generated in jQuery, so I also tried:</p>
  
  <pre><code>$('#pagination a').on('click', function() {
      console.log( $('#pagination a').index(this) );
  });
  </code></pre>
  
  <p>But I didn't get any output in the console when a link was clicked in either case.</p>
  
  <p>How do I do this?</p>