s / jquery rolando para a parte inferior da div quando a página é carregada (problema do I

s meus códigos funcionam perfeitamente no Firefox. Funciona no IE quando o conteúdo da div é menor, falha ao rolar para baixo quando o conteúdo da div é muito alto no IE. Clique no botão para rolar para baixo não tem problema, mas a página recarregada para rolar para baixo tem o problema. Como corrigir o problema do IE? como rolar para a parte inferior da div quando a página é carregada no IE? Abaixo estão meus códigos, você pode copiar e colar diretamente para testá-lo. :

<script src="javascripts/jquery-1.5.js" type="text/javascript" language="javascript"></script>

<script type="text/javascript">
function asd(){
d = document.getElementById('div');d.scrollTop = d.scrollHeight;
// $('#div').scrollTop($('#div')[0].scrollHeight);
}
</script>

<button onclick="d = document.getElementById('div');d.scrollTop = d.scrollHeight;">scroll-div</button>

<div id='div' style=' overflow:scroll; height:300px; width:200px; border:1px solid blue; background:blue;'>
        <p>asdasdas</p><p>asdasdas</p><p>asdasdas</p>
        <p>asdasdas</p><p>asdasdas</p><p>asdasdas</p>
        <p>asdasdas</p><p>asdasdas</p><p>asdasdas</p>
        <p>asdasdas</p><p>asdasdas</p><p>asdasdas</p>
        <p>asdasdas</p><p>asdasdas</p><p>asdasdas</p>
        <p>asdasdas</p><p>asdasdas</p>
        <p>asdasdas</p><p>asdasdas</p>
        <p>asdasdas</p><p>asdasdas</p>
        <p>asdasdas</p><p>asdasdas</p>
        <p>asdasdas</p><p>asdasdas</p>
</div>
<script type="text/javascript">
asd();
</script>

questionAnswers(2)

yourAnswerToTheQuestion