title: Jquery click function inside each loop
body: <p>When I click .zoom in this example, I inject 20 (the amount of items in the loop) .big_image divs.  I'd just like to insert one, relative to the item I am clicking.</p>
  
  <pre><code>$('.main img').each(function() {
  var img = this;
  $('.zoom').click(function() {
      $(this).after('&lt;div class="big_image"&gt;&lt;img src="'+$(img).attr('src')+'"&gt;&lt;/div&gt;');
  });
  });
  </code></pre>
  
  <p>I have simplified the script right down here.  Ideally I'd just like to know how to modify the click function (if possible) as there are other things going on not related to the question. Thanks!</p>
  
  <p><strong>EDIT: Working example <a href="http://houseofyum.co.uk/static/gallery/index3.html" rel="nofollow">here</a>.</strong></p>
  
  <p>The zoom button should appear on at least the first 2 images in the gallery (top left corner).  If it's confusing, I'm trying to get the zoom button to only appear on very long/tall images.  I'm also aware that I should split the setClass function up but haven't learned how to do that yet :)</p>