title: Why and how on earth would referencing a variable in the console.log fix a loading bug I've had?
body: <p>This is hard for me to fathom, and i don't like the 'solution' as it really shouldn't solve my problem.</p>
  
  <p>I have a function that 40% of the time does not follow entirely though. At first I thought it was due to me manipulating img and iframe elements on the fly, however i have done various things to make sure cache and loading is sorted before they do their thing.</p>
  
  <p>In particular, a thing i was doing with the <code>newCover</code> variable executed itself only 60% of the time. In my frustration I console logged <code>newCover</code> right at the end of the function, to try understand why it just didn't appear sometimes.</p>
  
  <p>But bizarrely, because i'm console logging the variable, i get 100% success rate with the function doing what it should.</p>
  
  <p>Why is that?!</p>
  
  <p>You can see it working on the third post here: <a href="http://syndex.me" rel="nofollow">http://syndex.me</a></p>
  
  <p>Here is the code:</p>
  
  <pre><code>albumCover = function(){
  $(".forPhotoset").each(function () {
      var forPhotoset = $(this);
      var myFrame = forPhotoset.find("iframe");
      myFrame.hide();
      myFrame.load(function(){
          var newCover = myFrame.contents().find('.photoset').children(':first-child').children(':first-child');
          newCover.children(':first-child').remove();
          var psPre = newCover.attr("href")+ '?' + (Math.random() * 1);
          newCover.append("&lt;img src='"+ psPre +"' alt='Cover Page' /&gt;");
          var psHeight = newCover.find('img');
          psHeight.load(function(){
              if (psHeight.height()&gt;heightRef){
                  psHeight.height(heightRef);
              }
          })
          newCover.detach();
          forPhotoset.append(newCover); //only executes 60% of the time
          console.log(newCover);//i added this, now i get 100% success rate?!
      })
  });
  }
  </code></pre>