MSIE issue using .innerHTML with Prototype Ajax calls

[oomagnumoo]

Friends,

What am I trying to accomplish?
I am making AJAX calls to my database to fetch dynamic data. While the user is waiting for the AJAX call to complete, I want to change the html of the div in question to display a little animated gif image to denote 'working' - (similar to something you'll see in windows when you're waiting for something to finish executing).

The problem
When I first load the page in MSIE I call the AJAX function to call and retrieve the question. It works perfectly, that is, the page is blank, on load it calls the ajax.updater function, it properly shows the waiting screen, then when onComplete triggers, it shows the question properly.

BUT when I click on the button again to do another Ajax.Updater call, it displays the waiting sign, I see my screen flicker with the new data in the database, then I shows the waiting div again. In other words, it doesn't display the new data on subsequent Ajax.Updater calls.. it keeps showing the waiting.gif.

The code

The ajax call below. I am using Updater since I want to simply update the div tag labeled 'question'

PHP Code:

    var myAjax = new Ajax.Updater(
        'question',
        url,
        {
            onLoading:function(request){waiting()()},
            onComplete:function(request){showword()()},
            method: 'get',
            parameters: pars
        });


PHP Code:

function waiting()
{
    $('question').innerHTML = "<center><br/><img src=\"images/waiting.gif\" /><br/>Retrieving Question<br/></center>";
    Effect.Fade($('vocab_question'));
}

function showword()
{
    if ("Explorer" == BrowserDetect.browser)
        setTimeout("Effect.Appear($('vocab_question'))",2000);
    else
        Effect.Appear($('vocab_question'));
}


Note:
1. $('question') is simply shorthand for document.getElementById('question') thanks to prototype 1.5.

2. Effect.Fade is a scriptaculous javascript effect. I've determined that this is not what is causing the problem.

Solutions?
I searched the forums prior to posting, but would not find a thread to help me out. Yes, I actually searched! I did come across something that I tried but it did not work. I did document.getElementById('question').firstChild.data = "waiting.gif"; I thought perhaps MSIE created subsequent childs of a div, but this was not the case either. At least, this did not work.

My other solution would be to simply create another div tag with the waiting screen already in it and just manipulate the class from display: hidden to display:visible. But I'm so deep into researching this problem that I want to figure out what is going on!

I did mention my above mentioned problem does NOT occur in Firefox right? In FF it works as intended.