how to do the same thing that load() with xhr?

Question

I have this code with load:

    $('#single-photo-zoom').load(href+' #content', function() {
        alert("ok");
    });

I want to use $.ajax, but I don't know how to load #content in #single-photo-zoom

  xhr = $.ajax({
        url: href,
        success: function(data) {
             // ???
        }
    });

I would like to use $.ajax because I want to have the possibility to abort loading. And it's not possible with load function.

Answer 1

First turn data into a jQuery object, then can retrieve the content you want from that object and insert in appropriate element:

success:function(data){
    var $content=$(data).find('#content');
    $('#single-photo-zoom').html( $content);
}

EDIT:

assumes that #content is in another parent like body or another div . If not a full page and #content is at root level use filter() instead of find()