title: Jquery click event on <a> tag not firing properly
body: <p>I'm trying to catch the jquery click event on an  tag with a class, but its not firing.</p>
  
  <p>HTML: (there's 10 blocks)</p>
  
  <pre><code>&lt;div id="block1"&gt;
     &lt;div class="slideshow"&gt;
        &lt;a class="popup" href="#imgform"&gt;
         &lt;img src="&lt;?php echo 'core/controllers/foto.php?o=1'; ?&gt;" title="1" width="271px" height="413px"&gt;
        &lt;/a&gt;
     &lt;/div&gt;
  &lt;/div&gt;
  &lt;div id="block2"&gt;
     &lt;div class="slideshow"&gt;
        &lt;a class="popup" href="#imgform"&gt;
         &lt;img src="&lt;?php echo 'core/controllers/foto.php?o=2'; ?&gt;" title="2" width="200px" height="129px"&gt;
        &lt;/a&gt;
     &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>jQuery:</p>
  
  <pre><code>$(document).ready(function() {
      var $popup = $('a.popup');
      $popup.live('click',function(){
          var id = $popup.parent().parent().attr('id');
          id = id.substring(5);
          alert(id);
          $.get('index.php?o='+id, function(data) {
              $popup.fancybox({
                  //do stuff
              });
          });
      });
  });
  </code></pre>
  
  <p>The alert is always returning 1 for some reason.</p>