IE JQuery ready function not working

Question

Apparently many people have run into this problem, but I have yet to be able to find a solution that works.

I have a bit of code which needs to run once the page has loaded, and so I stuck it inside the following block:

$(document).ready(function() {
    alert("Running initialization");
    initialize();
});
function checkDivLoaded() {
    if ( $('#footer').length == 0) $.error( 'not ready' );
}
function initialize() {
    try{
        checkDivLoaded();
        ...more code here
    } catch (err) {
        setTimeout(initialize, 200);
    }
}

This works fine in all browsers, with the exception of IE. There, the code does not execute at all.

This code is at the lowest point on the page that I can put it (using the Zend Framework and page-specific ready() functions means that there is a limit to how low on the page it can go). I've checked the includes for the js files, which are all being loaded from a local version, and they all have the form

<script type="text/javascript" src=""></script>

Any ideas?

NOTE

When I open the debugger in IE, this starts to work correctly.

Answer 1

Using (function($) {})(jQuery); fixed the issue for me.

(function($) {
  // body code
})(jQuery);

Answer 2

I don't see anything wrong here, but there are just a few things I'd like to point out.

Before I do that, check IE's JavaScript console, my guess is an earlier script has an error, and that's why this one never gets run.

Instead of $(document).ready(function(){});, you can actually just do $(function(){}). it shouldn't make a difference, though.

Also, please don't pass strings to setTimeout (they get eval'd in the global scope), pass a function.

setTimeout(initialize, 200);

Also, are you sure you declared $jquery (shouldn't it be $.error)?

<script type="text/javascript">
   $(function() {
       initialize();
   });
   function checkDivLoaded() {
       if ($('#footer').length == 0){
          $jquery.error( 'not ready' );
       }
   }
   function initialize() {
       try{
           checkDivLoaded();
           //...more code here
       } catch (err) {
           setTimeout(initialize, 200);
       }
   }
</script>

EDIT: If you're using IE8 or lower, it doesn't add console unless the debugger is open (I wish whoever thought that was a good idea has been fired). If one of your includes uses console.log it would be undefined, thus stopping all script execution.

Try adding this to the top of the page:

window.console = window.console || {log:function(){}};

It will make a "fake" console object, so that console.log will be defined.