scrolling to bottom of div with .scrollTop

[scoob19]

I have an Ajax chatroom that works just like i would like, except for one problem. When a user submits a new message the div scrolls to the bottom like it should, except when the message takes up more than one line (and wraps around to the next line). In this case, it will scroll down to the bottom, then jump up just a little.

So if a user submits a long message that takes up 3 lines in the div, it will scroll down and then pop up a couple lines. The more lines it wraps around, the futher it will pop up. (I hope ive explained it clearly enough).

The following is a snippet of javascript that fills up the div and then scrolls to the bottom.

 for (var i=0; i<messageCount; i++)
 {
  $('chatwindow').innerHTML = $('chatwindow').innerHTML +
  '<p class="message">[' + newMessages[i].timestamp_display + '] <span class="screenname">' + 
  newMessages[i].author + ': </span>' + newMessages[i].text
  + '</p>';
 }
 $('chatwindow').scrollTop = $('chatwindow').scrollHeight;
 
 

Any help would be appreciated.

[Dabrowski]

Just out of interest, does it work if you use scrollHeight +50 or something like that?

I'm wondering if it attempts to scroll before it's properly attached your latest <p>?