title: jQuery fadeIn when done loading each individual DIV with image?
body: <p>I have a website that displays alot of pictures. Instead of showing them and watching it load, is there a way to fade it in after it's done loading? Kinda new to the wonderful world of jQuery and javascript. </p>
  
  <p>Right now I get data from a PHP file which calls the mySQL server and gets the latest images. It just returns a big block of HTML to display:</p>
  
  <pre><code>// If the user clicks the logo
  $("#logo").click(function() {
  $("#right_bar_wrapper").animate({ height: 'toggle', opacity: 'toggle' }, '200');
  var thePostData = "username=c";
  $.ajax({
    type: "POST",
    url: "http://myflashpics.com/v2/process_newsfeed.php",
    data: thePostData,
    success: function(theRetrievedData) {
      document.getElementById('right_bar_wrapper').innerHTML = theRetrievedData;
      $("#right_bar_wrapper").fadeIn("200");
  
    }
  });
  });
  </code></pre>
  
  <p>Here's what ONE div looks like that contains each image:</p>
  
  <pre><code>&lt;div class='sidebar_image_box_newsfeed'&gt; 
  &lt;div class='sidebar_image_box_newsfeed_user_info makeProfileAppear' id='user_coultonvento'&gt;&lt;img src='http://myflashpics.com/get_image.php?short_string=kmdp&amp;size=thumbnail' /&gt;TheAmazingCoultoniusTheFourneeth...&lt;/div&gt; 
  &lt;img src='http://myflashpics.com/get_image.php?short_string=6v9o&amp;size=big' id='image_6v9o' class='makePictureBig' style='width: 180px;' /&gt; 
  &lt;div class='sidebar_image_box_newsfeed_user_info_comments' style='float: right; margin-top: -1px; margin-left: 20px; display: none;' id='bigpicture_comment_6v9o'&gt;9&lt;/div&gt; 
  &lt;div class='sidebar_image_box_newsfeed_caption'&gt;Usama bin laden? I believe that's a typo, Fox. &lt;/div&gt; 
  &lt;div class='sidebar_image_box_newsfeed_user_info_comments' id='littlepicture_comment_6v9o'&gt;9&lt;/div&gt; 
  &lt;div style='clear: both;'&gt;&lt;/div&gt; 
  &lt;/div&gt;&lt;div class='sidebar_image_box_newsfeed'&gt; 
  &lt;div class='sidebar_image_box_newsfeed_user_info makeProfileAppear' id='user_BrandonVento'&gt;&lt;img src='http://myflashpics.com/get_image.php?short_string=e4r7&amp;size=thumbnail' /&gt;Brandon Vento&lt;/div&gt; 
  &lt;img src='http://myflashpics.com/get_image.php?short_string=o1sk&amp;size=big' id='image_o1sk' class='makePictureBig' style='width: 180px;' /&gt; 
  &lt;div class='sidebar_image_box_newsfeed_user_info_comments' style='float: right; margin-top: -1px; margin-left: 20px; display: none;' id='bigpicture_comment_o1sk'&gt;9&lt;/div&gt; 
  &lt;div class='sidebar_image_box_newsfeed_caption'&gt;&lt;/div&gt; 
  &lt;div class='sidebar_image_box_newsfeed_user_info_comments' id='littlepicture_comment_o1sk'&gt;9&lt;/div&gt; 
  &lt;div style='clear: both;'&gt;&lt;/div&gt; 
  &lt;/div&gt;
  </code></pre>
  
  <p>Sure, it fades in but the user sees it load. </p>
  
  <p>What would the best way to do this be?</p>
  
  <p>Thanks, <br> Coulton</p>