Paging with JQuery PHP MySql in MVC model

Well I'm having a problem, I have a table with the conversations of an internal system chat that was created here in the company. My task will be to page the history generated with the "Previous" and "Next" buttons by limiting the number of messages sent. I have the code for html , javascript and php (controller) I hope that if they can not help me out, some light would be enough for my walk!

The html code:

<div class="row mtop10" style="height:95% !important; margin-bottom: -30px;">
   <div class="col-xs-12 historico_chat" id="historico_chat">

   </div>
</div>
<center>
    <button id="anterior" class="anterior">&lt;&lt; Anterior</button>&nbsp;&nbsp;&nbsp;
    <span id="numeracao"></span>&nbsp;&nbsp;&nbsp;
    <button id="proximo" class="proximo">Próximo &gt;&gt;</button>
</center>

The PHP code:

public function ajaxcarregaHistoricochat(){

 $obj_chat        = new daoChat();
 $chat            = $obj_chat->Where(" (iat_destinatario = '".$_POST['ifu']."' AND iat_remetente = '".$_POST['remetente']."') OR (iat_destinatario = '".$_POST['remetente']."' AND iat_remetente = '".$_POST['ifu']."') ")->Limite(1, 10)->Recursiva()->Consultar();

 $html  ="";
 $html .="<div>";
      foreach ($chat as $ch){
          $html .="<p style='color: blue; font-weight: bold; text-align:left;'>".$ch['iat_destinatario']."</p>";
          $html .="<p style='color: red;text-align:left;'>".$ch['iat_mensagem']."</p>";
      }

    $html .="</div>";

    echo $html;
}

And the code in JS:

$("body").on("click",".abre_historico",function(){
    $(".modal_historico").css("z-index","999");
    modal.style.display = "block";
    var remetente = $("#chat_remetente").val();
    var ifu       = $(this).data("ifu");
    //alert(ifu);
    $.post(""+url+"insoft/header/ajaxcarregaHistoricochat",{remetente:remetente,ifu:ifu},function(data){
        $("#historico_chat").html(data);
    });
});