数据库更改时页面AUTO-UPDATE

Question

目前，一切都运行良好的脚本，我在我的数据库中插入数据，我刷新，我得到新消息的用户名。但是，我试图弄清楚如何在不更新数据库的情况下更新数据库时将消息添加到页面上。

简单的HTML，这是消息加载的地方

<div id="msg">
</div>    

每当页面加载完毕，我都会调用AJAX来获取数据

<script type="text/javascript">
$(function(){
//AJAX
var hr = new XMLHttpRequest();
var url = "exampleclass.php";
var msg = document.getElementById("msg");
hr.onreadystatechange=function()
{
    if (hr.readyState==4 && hr.status==200)
    {
        document.getElementById("msg").innerHTML=hr.responseText;
    }
}
hr.open("GET", url, true);
hr.send();
});
</script>

这是我的PHP表单，用于检索数据

<?php
include('inc/connect.php');
$query = "SELECT message, user_name "
   . "FROM chat "
   . "WHERE (user_name='bryan' or user_name='derek') "
   . "AND (user_to='derek' or user_to='bryan')";
while ($retrievedata = mysql_fetch_assoc($sql)){
echo $retrievedata['user_name'].": ".$retrievedata['message']."<br/>";
}
?>