jQuery Ajax Get Data Syntax error, unrecognized expression:

Question

Using the latest jQuery (1.9.0), I am confused as to why this code is not working:

$.testAjaxFilter = function() {

    var base = this;

    // get faq categories
    var currentFaqCategories = $('#category-list ul li a');

    // loop through each faq category link and bind a click event to each
    if ( typeof currentFaqCategories !== 'undefined') {

        $.each(currentFaqCategories, function(index, category) {

            $(category).click( function(e) {
                $(e.target).getFaqList();
                return false;
            });

        });

    }

    // GET faq list elements from category link
    $.fn.getFaqList = function() {

        $.get($(this[0]).attr('href'), function(data) {

            base.addFaqSectionToPage( $(data).find('section.faq-page #content-column') );

        });

    };

    // add new faq section to current page
    this.addFaqSectionToPage = function(faqSection) {

        // remove old faq section
        var currentFaqSection = $('section.faq-page #content-column');

        currentFaqSection.empty();
        currentFaqSection.append(faqSection);

    };

};

$.testAjaxFilter();

While viewing the console, upon clicking one of the category links, the GET retrieves the entire page in its response, but it is then followed by a Syntax error, unrecognized expression: (lists all HTML from retrieved page). So, something is going wrong in $.fn.getFaqList, possibly the use of $(data)?

Is there anything obvious I am doing wrong? Any help would be greatly appreciated. I am not very savvy with AJAX stuff.

Answer 1

Thanks to Musa for pointing this out. I would reward you as the correct answer... but I guess I can't do that to a comment :(

I had to replace:

$(data).find

with this:

$($.parseHTML(data)).find

I had tried something similar before, based on other Stackoverflow answers, but I was not executing it properly so I kept getting the error. For anyone who needs more clarity on the issue, these answers might help:

JQuery unrecognized expression on Ajax response

jQuery + client-side template = "Syntax error, unrecognized expression"