window.scrollTo(0, document.body.scrollHeight) Not working on fixed height?

Question

I want to go end of the page when I click on a button .I have data on this div (coming from server). But when I give the div height, it doesn't work. When I remove the height from the div, it works.

<div id="realTimeContents" class ="left realtimeContend_h" style="width:97%; height:850px">
</div>

I'll elaborate: When I get data from server, I append the data with auto scrolling (that's why I need the height of the div). But when I give it height, it stops going to the end of the page

function nativePluginResultHandler (result)
{
    $('#realTimeContents' ).append(result);

    var elem = document.getElementById('realTimeContents');// just to scroll down the line 
    elem.scrollTop = elem.scrollHeight;
}

Here is fiddle . http://jsfiddle.net/ravi1989/s66Ww/

Answer 1

try following:

var $div = $("#realTimeContents");

$("#btnScroll").on("click",function(){    
    $div.scrollTop($div[0].scrollHeight);
});

working fiddle here: http://jsfiddle.net/s66Ww/2/

Hope it helps.