animation - jquery fadeIn/Out IE problem - frustrating

Question

please please help me someone, i am losing my mind.

i have absolute/relative (tried both) positioned divs all with class of box. on click i want the divs to fade out then the correct one fade in. works fine in all browsers apart from IE 6 and 7 (sometimes 8). they fade out but nothing fades back in. looked all over the net for this type of problem but none help. Please please help.

this is the code

$("li#about").click(function(){
   $box.fadeOut(200);
   $("div#about").delay(800).fadeIn(800);
});

$("li#portfolio").click(function(){
    $box.fadeOut(200);
    $("div#portfolio").delay(800).fadeIn(800);
});

etc......

what am i missing? demo here - dead link!

Answer 1

If I'm reading this correctly, do you have multiple HTML tags with the same ID, even though they're different types of tags? For example, li#about and div#about. Maybe Internet Explorer would prefer if they had unique IDs?