Problem to add text to the textbox

[flexed]

Dear all,

I add some text to the textarea and the text will be added like this:

var mdiv = document.getElementById("messages");

for (i=0; i<2000; i++) {
mdiv.innerHTML = mdiv.innerHTML + "text <br/>\r\n";
}

How can I put the scrollbar down, to the last input during the text is added? Now, the user have to move the scroll bar, after the text was added. It can be so, that the text will be added dynamically and I want to show the user the actuall block of the information. How can the program follow the input and output is always down in the box?

Actually I am not going to use textarea, I have created div:

<table><tr><td width="200" height="200"><div id="messages"></div>
</td></tr></table>

<style type="text/css">
#messages {
background: white;
margin-left: 5px;
height: 98%;
padding-left: 5px;
padding-right: 5px;
border: 1px solid #256087;
overflow: scroll;
margin-right: 5px;
}
</style>

It should be like in a chat. But in my case after the text was added, the scroll bar is up and if I move scroll bar, while adding a new portion of information, it's not good.

Thanks in advance.

[flexed]

I have tried focus(), but it sets focus to the textbox and not to content. The scroll don't move to the last input. Still can't solve the problem.