Scrollbar Position Setting

scrollbar positioning according to chatbox (div) height.

HTML

<!--
Name  : Aqeel Malik (Web Developer)
Email : [email protected]
Mobile: +92 302 6262164
Skills: xHTML | HTML5 | CSS3 | Bootstrap | Wordpress | Javascript | jQuery | Ajax | PHP-MySQL | Photoshop | Firework | Dreamweaver
-->
<div id="chatbox">
    <p>Aqeel</p>
    <p>Aqeel</p>
    <p>Aqeel</p>
    <p>Aqeel</p>
    <p>Aqeel</p>
    <p>Aqeel</p>
    <p>Aqeel</p>
    <p>Aqeel</p>
    <p>Aqeel</p>
    <p>Aqeel</p>
    <p>Aqeel</p>
    <p>Aqeel</p>
    <p>Aqeel</p>
    <p>Aqeel</p>
    <p>Aqeel</p>
    <p>Aqeel</p>
    <p>Aqeel</p>
    <p>Aqeel</p>
    <p>Aqeel</p>
    <p>Aqeel</p>
    <p>Aqeel</p>
    <p>Aqeel</p>
    <p>Aqeel</p>
    <p>Aqeel</p>
    <p>Aqeel</p>
    <p>Aqeel</p>
    <p>Aqeel</p>
</div>

CSS

/*
Name  : Aqeel Malik (Web Developer)
Email : [email protected]
Mobile: +92 302 6262164
Skills: xHTML | HTML5 | CSS3 | Bootstrap | Wordpress | Javascript | jQuery | Ajax | PHP-MySQL | Photoshop | Firework | Dreamweaver
*/
#chatbox {
    height: 200px;
    overflow-y: scroll;
		background: white;
		border: 1px dashed green;
}

JavaScript

/*
Name  : Aqeel Malik (Web Developer)
Email : [email protected]
Mobile: +92 302 6262164
Skills: xHTML | HTML5 | CSS3 | Bootstrap | Wordpress | Javascript | jQuery | Ajax | PHP-MySQL | Photoshop | Firework | Dreamweaver
*/
function insertLine() {
	var scrollPosition = jQuery("#chatbox").scrollTop();
	var scrollHeight = jQuery("#chatbox")[0].scrollHeight;
	//console.log(scrollPosition,scrollHeight);
	//jQuery("#chatbox").append("<div>Aqeel: Hello World! - " + scrollHeight + "</div>");
	if (scrollPosition + jQuery("#chatbox").height() === scrollHeight) { 
		$("#chatbox").scrollTop(scrollHeight);       
	}
	setTimeout(function(){insertLine();}, 1000)
}
insertLine();