show()/hide() to put up a busyloading spinner
<p>Problem with show()/hide() to put up a busyloading spinner.</p>

<p>This does not work:</p>

<pre><code>&lt;div id="spinner" class="spinner" style="display:none;"&gt;
  &lt;img src="busyloading.gif"&gt;
&lt;/div&gt;


$('#spinner').show();

//some busy task here
for (i=0;i&lt;=10000;i++){
    i++;
}

$('#spinner').hide();
</code></pre>

<hr>

<p>In the end I got it working with jQuery.ajaxSetup, 
but I still would like to figure out why it was not working with regular show/hide:</p>

<pre><code>jQuery.ajaxSetup({   
    beforeSend: function() {   
        $('#spinner').show()   
    },
    complete: function(){   
        $('#spinner').hide()   
    },   
});   
</code></pre>

<hr>

<p>Additional info: 
seems like there is a difference in chrome vs firefox:
At least in FireFox if I add an alert() before the loop - 
the spinner shows up.
In Chrome - even if I add alert() - there is no spinner.</p>
