the function gets call only once
<p>I have a class on hover of that I am showing a "Dialog" as tooltip which contains prev/next navigation button. On basis of that I am updating the contents.</p>

<p>But, I am able to execute it only once.
Here is the code:</p>

<pre><code>$(".corner").mouseenter(function(e){
    tt_index=1;

    var id=this.id;
    $("#popup-div").html(getMultipleBooking(id.toString(),tt_index));
    $("#popup-div").height(120);

     $("#popup-div").dialog({
         resizable: false,
         autoOpen: true,
         width: 277,
         position: [e.pageX+5, (e.pageY+5)-$(document).scrollTop()+10], 

         });

     $(".ui-dialog-titlebar").hide();

     //closing the dialog when mouse enters into the white space

     $("#tt_next").click(function(){
         ++tt_index;
         $("#popup-div").html(getMultipleBooking(id.toString(),tt_index));          
    });
});
</code></pre>
