title: Javascript function not always loading after element is ready
body: <p>I have a Javasript function that doesn't <em>always</em> get run through. The function is under a jQuery.bind, that is attached to the video player on the page. Once the video player is ready the function should run, some elements of the functions depend on the duration of the video which can only be obtained once the video player is ready.</p>
  
  <p>It seems to work a good majority of the time, but sometimes (3/10 times) it doesn't. Not sure why this is happening.</p>
  
  <pre><code>ML = (typeof ML === "undefined") ? {} : ML;
  ML.player = null;
  
  //Initialization of the video player
  jQuery(document).ready(function() {
      var vidId = vidIdRaw.split("/");
      ML.player = new SV.Player({
          videoId: vidId[0]
      });
      //More functions are initialized under the document.ready
  
      //Waits for video player to be ready before executing function
      //This is the function that doesn't always run
      ML.player.bind('ready', function(obj) {
          var isReady = true;
          jQuery('#duration-time').html(formatTime(ML.player.getDuration()));
          //Functions initialized above are called and run here as well.
      }
  }
  </code></pre>
  
  <p>I left most of the functions out as there is a lot of code I'd have to include. I've included the relevant information.</p>