How to scroll to bottom of the div

JavaScript
1

Hi i set the scroll to bottom of the div on load, then i called ajax for getting updated content, after that i try to set the following coding



var container = $('.im'),
    scrollTo = $('#last');

container.scrollTop(
    scrollTo.offset().top - container.offset().top
);

from http://jsfiddle.net/xY7tx/

but not wokred as expected. please any one guide to fix this problem

2

Its works when i have added css for the div

like


<html>
 <script src="http://code.jquery.com/jquery-latest.js"></script>
<script type="text/javascript">

var container = $('.im'),
    scrollTo = $('#last');

container.scrollTop(
    scrollTo.offset().top - container.offset().top
);

</script>
<style>
.im {
    width: 100px;
    height: 70px;
    border: 1px solid blue;
    overflow: auto;
}

</style>
<body>
<div class="im">
message<br/>
message<br/>
message<br/>
messsage<br/>
<div id="last">Lastmessage</div>
</div>
</body>
</html>
3

another method for scroll to bottom of div


<html>
 <script src="http://code.jquery.com/jquery-latest.js"></script>
<script type="text/javascript">

$('html, body').animate({ scrollTop: $(".im").height() }, 'slow');

</script>

<div class="im">
message<br/>
message<br/>
message<br/>
messsage<br/>
messsage<br/>
messsage<br/>messsage<br/>messsage<br/>messsage<br/>messsage<br/>messsage<br/>messsage<br/>messsage<br/>messsage<br/>messsage<br/>messsage<br/>messsage<br/>messsage<br/>messsage<br/>messsage<br/>messsage<br/>messsage<br/>messsage<br/>messsage<br/>messsage<br/>messsage<br/>messsage<br/>
Lastmessage
</div>
</body>
</html>