jQuery's removeClass or toggleClass not working in ie8? Why? How do I get it to work correctly?
<p>The following example works fine in Firefox and Opera, but not in ie8. However, if I turn compatibility mode on in ie8, it works correctly. Why? And how do I fix it?</p>

<p>The below example shows the use of toggleClass, but replacing this with addClass and removeClass still has the same problem.</p>

<pre><code>&lt;!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"&gt;
&lt;html&gt;
&lt;head&gt;
&lt;meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"&gt;
&lt;title&gt;Untitled Document&lt;/title&gt;
&lt;script type="text/javascript" src="/jquery/js/jquery-1.3.2.min.js"&gt;&lt;/script&gt;
&lt;script type="text/javascript" src="/jquery/js/jquery-ui-1.7.2.custom.min.js"&gt;&lt;/script&gt;
&lt;style type="text/css"&gt;
    .dostuff{
        background-color: green;
    }
    .undostuff{
        background-color: red;
    }
&lt;/style&gt;
&lt;script language="javascript"&gt;

    $(document).ready(function(){
        $('#DoStuffButton').click(function(){doStuff();});
        $('#UndoStuffButton').click(function(){undoStuff();});

        function doStuff(){
            $('#test').html('Do some stuff');
            $('#test').toggleClass('dostuff', 'slow', callback('dostuff'));
        }

        function undoStuff(){
            $('#test').html('Undo some stuff');
            $('#test').toggleClass('undostuff', 'slow', callback('undostuff'));
        }

        function callback(className){
            setTimeout(function(){
                $('#test').toggleClass(className, 'slow');
            }, 1500);
        }


    });
&lt;/script&gt;
&lt;/head&gt;
&lt;body&gt;
    &lt;div id="test"&gt;Blah blah blah&lt;/div&gt;
    &lt;div&gt;
        &lt;button id="DoStuffButton" name="DoStuffButton"&gt;Do some stuff&lt;/button&gt;
        &lt;button id="UndoStuffButton" name="UndoStuffButton"&gt;Undo some stuff&lt;/button&gt;
    &lt;/div&gt;
&lt;/body&gt;
&lt;/html&gt;
</code></pre>

<p>EDIT:
Changing the javascript to the following also has the same problem in ie8. Any explanation why, and how to get it to work correctly?</p>

<pre><code>function doStuff(){
            $('#test').html('Do some stuff');
            $('#test').addClass('dostuff', 'fast');
            setTimeout(function(){$('#test').removeClass('dostuff', 'slow');}, 1000);
        }

        function undoStuff(){
            $('#test').html('Undo some stuff');
            $('#test').addClass('undostuff', 100);
            setTimeout(function(){$('#test').removeClass('undostuff', 'slow');}, 1000);
        }
</code></pre>
