converting xml http request into $.post

i have came across a video tutorial about doing chatbox in php. I used a ajax request that i wasn't familiar with which is xmlhttp request. For some reason the xml script only works if i place it in the html file, but doesn't work if i place it in the .js file. So i am planning to convert xml http request to $.post as i sort of the know the logic.

So i'm here to check if anyone know if there is any reason that chatbox is only supposedly to be done with xml http request and that i should use $.post? Thanks!

script

function submitChat(){
    if(form1.uname.value == "" || form1.msg.value ==""){
        alert("All fields are mandatory");
        return;
    }
        form1.uname.readOnly = true;
        form1.uname.style.border = 'none';
        var uname = form1.uname.value;
        var msg = form1.msg.value;
        var xmlhttp = new XMLHttpRequest();

        xmlhttp.onreadystatechange = function(){
        if(xmlhttp.readyState==4&&xmlhttp.status==200){
            document.getElementById('chatlogs').innerHTML = xmlhttp.responseText;
        }
    }

    xmlhttp.open('GET','insert.php?uname='+uname+'&msg='+msg, true);
    xmlhttp.send();
}

html

<form name="form1">
      Enter Your Chatname: 
      <input type="text" name="uname" /><br />
      Your Message: <br />
      <textarea name="msg"></textarea><br />
      <a href="#" onclick="submitChat()">Send</a><br /><br />

      <div id="chatlogs">
      Loading Chatbox Please Wait...
</div>