div disappear and then appear after a post function call with JQuery

I'm achieving an AJAX Chat, and it's almost done. What I have so far is, a div holding the messages, a textarea and a button, after clicking the send button, data go to another .php file through a post:

function send(pid){
    $.post("SetAndGet.php",{
        msgChat: $("#messagePM"开发者_JS百科).val(),
        idpChat: pid
    },function(data){
        $("#messagesPM").html(data);
    });
}

The problem I'm asking about (and considering so weird) is that in the response, the div messagesPM disappreas and appears again holding the new messages. Why does it disappear and how do I fix that?

    function send(pid){
      $.post("SetAndGet.php",{ msgChat: $("#messagePM").text(), idpChat: pid },function(data){ $("#messagesPM").append(data); });
 })

Firstly if $("#messagesPM") is a DIV, .val() will not return the content of the div, you must use .text() to get the text inside of a div.

Secondly using HTML() will replace the div with whatever gets returned, so use append. UNLESS you are returning a DIV html tag with its content set.