jQuery .load() issue in IE, Sinatra

I'm building a site, almost done, but I ran into an issue when testing on IE8. Take a look at:

http://ryanrogalski.com/creepyhtml

When you go to another part of the site via the nav bar, the content in the middle fades out then isn't replaced. I'm assuming this is an issue with .load() as its only on IE, works fine on Chrome, FF, and Safari.

I also have the site built and hosted at http://creepy.heroku.com and it is working fine, but is using Sinatra. The client wants the site as basic html, so I am stuck fixing something that already works fine because they don't want to host on heroku.

Heres my nav.js script:

$(document).ready(function() {
    var link = $('#nav a');
    link.click(function() {
        var href = $(this).attr('href');
        link.removeClass('color');
        $(this).addClass('color');
        $('#container').fadeOut(1000, function() {
            $(this).empty().load(href + ' #container',function() {
                $(this).fadeIn(1000);
            });
        });
        return false;
    });
});

$(document).ready(function() {
    var link = $('#head a');
    link.click(function() {
        var href = $(this).attr('href');
        $('#container').fadeOut(1000, function() {
            $(this).empty().load(href + ' #container',function() {
                $(this).fadeIn(1000);
            });
        });
        return false;
    });
});

Anyone have any ideas a开发者_开发知识库s to how I could edit this to allow the content to load back in?

Thanks in advance for your help.

IE doesn't seem to like the object tags or whitespace (carriage returns/line feeds). Can you remove them? =)

$.get("creepy_music.html?" + new Date().getTime(), function(data) {
    $('#container').html(data.replace(/[\r\n]*\\|object*/g, ''));
});