fail scroll to bottom of a div on IE

I try to auto scroll to bottom of a div when the page is loaded. It works on firefox but it is not working on IE. How to scroll to bottom on a div when page is loaded on IE? You can test it by copy paste my codes into two html files.

test5.html :

<div id='div' style='overflow:scroll; height:300px; width:200px; border:1px solid blue; background:yellow;'>
</div>
<script src="javascripts/jquery-1.5.js" type="text/javascript" language="javascript"></script>
<script type="text/javascript">
function showrsp(){
    jQuery.get("test5a.html", function(data) {
        $('#div').append(data); 
        $(document).ready(function(){asd();});
    }); 
};

function asd(){
    $('#div').scrollTop($('#div')[0].scrollHeight);
}

showrsp();
</script>

test5a.html :

<p>asdasdas</p>
<p>asdasdas</p><p>asdasdas</p><p>asdasdas</p><img src="http://2aek.com/inventory/emoticons2/69.gif" border="0" />
<p>asdasdas</p><p>asdasdas</p><p>asdasdas</p><img src="http://2aek.com/inventory/emoticons2/69.gif" border="0" />
<p>asdasdas</p><p>asdasdas</p><p>asdasdas</p><img src="http://2aek.com/inventory/emoticons2/69.gif" border="0" />
<img src="http://2aek.com/inventory/emoticons2/69.gif" border="0" /><img src="http://2aek.com/inventory/emoticons2/69.gif" border="0" />
<img src="http://2aek.com/inventory/emoticons2/69.gif" border="0" /><img src="http://2aek.com/inventory/emoticons2/69.gif" border="0" />
<img src="http://2aek.com/inventory/emoticons2/69.gif" border="0" /><img src="http://2aek.com/inventory/emoticons2/69.gif" border="0" />
<img src="http://2aek.com/inventory/emoticons2/69.gif" border="0" />
<p>asdasdas</p><p>asdasdas</p><p>asdasdas</p>
<p>asdasdas</p><p>asdasdas</p><img src="http://2aek.com/inventory/emoticons2/69.gif" border="0" />
<p>asdasdas</p><p>asdasdas</p>
<p>asdasdas</p><p>asdasdas</p><img src="http://2aek.com/inventory/emoticons2/69.gif" border="0" />
<p>asdasdas</p><p>asdasdas</p><img src="http://2开发者_如何学运维aek.com/inventory/emoticons2/69.gif" border="0" />
<p>asdasdas</p><p>asdasdas</p><img src="http://2aek.com/inventory/emoticons2/69.gif" border="0" />
<p>asdasdas</p><p>asdasdas</p><img src="http://2aek.com/inventory/emoticons2/69.gif" border="0" />

How to wait until innerHTML finish render the contents before execute function asd()?

Note : you can try replace my code $(document).ready(function(){asd();}); with setTimeout("asd();", 3000); to wait for 3 seconds then only execute asd(). All messages are displayed within 3 seconds, so the scrollbar success position at the bottom. Unfortunately I don't know how long it takes to display all messages, maybe 5 or 10 seconds? How to detect when the contents are finish rendered?