Question

Below is the code snippet which is hitting the url on server and getting the html response.I can see
the response inside firefox debugger but it does not display in div tag.

$.ajax({
    url: url,
    dataType: 'html',
    data: '',
    type: 'POST',
    success: function(data) {
        //in firefox debugger i can see complete html response inside data 
        $('#displayContent').html(data); // but here, it does not  
        // append the html inside div displayContent. Instead it makes 
        // the current page blank
    }
});​

I don’t get what mistake I’m making here Can I not directly assign the ajax html response to an selector(div tag in my case) with $('#displayContent').html(data)?

Answer 1

Instead of using html() method use append i.e.

$('#displayContent').append(data);

Or if you want to assign whole content direct to your element use load method

$(function(){
   $('#displayContent').load(url);
});