I'm trying to extract an element's children from an AJAX call, but am having difficulty isolating it. My code is as follows:

function AJAXcomplete(data){
    var result = $(data).find('#productDetails > *');
    jQ('#productDetails').append(result);
};

function getDetails(e){
    e.preventDefault();
    var addy = jQ(this).attr("href");
    jQ('body').append('<div id="productDetails"></div>');
    jQ('#productDetails').show();
    $.get(addy, AJAXcomplete);
};

jQ('#slides').on('click', '.slideLink', getDetails);

The above should append the children of #productDetails from the AJAX call, and append them to a newly created div of the same id.

I can successfully retrieve the entire AJAX data and append that (tested) but I can't get the element I want. Am I doing something obviously wrong?

Changing

var result = $(data).find('#productDetails > *');

to

var result = $(data).filter('#productDetails').children();

solved the issue.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.