How to update users chat for new insert row messages from db in jquery ajax without refreshing the page

See more:

PHP

Ajax

jQuery

I am working on a project,as am trying to check new inserted messages in db for each user and echo that when the user is chatting with another without refreshing the page to see the new message,but i try using setInterval but the problem is that once the user login the all messages will display for 3 seconds and disappear from the chat.
i used .html(),but when i use .append() it append same messages every 3 seconds please i need help on how to solve this i want it be working like facebook chat.

What I have tried:

this my jquery ajax request and the feedback code

setInterval(function(){
	var id = $(".id").val();
	  //alert(id);
	  $.ajax({
  type:'get',
   url:"msg.php",
   data:{id:id},
   success: function(data){
   $("#msgnot").append(data);
   // $("#msgnot").html(data);
   }

});
    },3000);

msg.php


<?php 
   session_start();
   include 'db.php';
   
   if(isset($_GET["id"])){
     $ids = $_GET["id"];
	    $sql = "select * from answers where userid='$ids' and msgstatus='0'";
       $query = mysqli_query($con,$sql);
       while($rows = mysqli_fetch_assoc($query)){
	 
	  ?>
	  <div id="reply"><a href="read.php?id=<?php echo $rows["id"]; ?>"><?php echo "message from ".$rows["replyid"]; ?>
	  <div id="m_active">
	  <?php
         if($rows["msgstatus"] == "0"){
		       echo "">"."1"."<br>";
		 }else{
		 }
		} 
		 }
	  ?></a></div></div>