title: jquery changing image height changes images to wrong height
body: <p>I have several images on a page. Every image except the first has a class of "index_image".  I want each image to have the same height as the first image.  Here is the first image:</p>
  
  <pre><code>&lt;img alt="Image 1" id="ride_image" 
   src="image-1.png"&gt;
  </code></pre>
  
  <p>Here is the javascript that does the image changing:</p>
  
  <pre><code>&lt;script&gt;
      $(document).ready(function() {
          var image_1_height = $('#ride_image').height();
          alert(image_1_height);
          $('.index_image').height(image_1_height); 
      });
  &lt;/script&gt;
  </code></pre>
  
  <p>It is changing all of the image's height to zero instead of the height of the first image.  I think this has something to do with the code being called before the images height is set, because first there are no images on the page, then the alert appears, and then the first image appears.  The rest of the images heights are changed to zero right away so they never appear.</p>
  
  <p>How do I change the height properly?</p>