CODEWITHSUNDEEP
jqueryajax
pixelboy
pixelboy

Reputation: 729

jquery ajax response is html, but can't manipulate it

I'm basically trying to work on server response sent in html. I'd like to count a number of elements present in the DOM fragment sent back by the server. Yet, when I do :

  $.ajax({
    url: '/myAjaxUrl',
    type: "POST",
    data : params,
    dataType: 'html',
    success: function(data){
        var total = $(data).find('li').length;
        console.log(total);
    }
  });

my var total is 0. Firefbug displays correct html, and the fragment DOES contains <li/> elements. Where am I being wrong ?? Oo ??

Here are the response headers sent :

Date    Tue, 03 May 2011 12:52:55 GMT
Server  Apache/2.0.64 (Unix) PHP/5.3.5 DAV/2
X-Powered-By    PHP/5.3.5 
Expires Thu, 19 Nov 1981 08:52:00 GMT
Cache-Control   no-store, no-cache, must-revalidate, post-check=0, pre-check=0
Pragma  no-cache 
X-Robots-Tag    noindex,nofollow
Keep-Alive  timeout=15, max=99
Connection  Keep-Alive
Transfer-Encoding   chunked
Content-Type    text/html

And part of the HTML answer:

<li >
    <div class="">
        <a class="lookVisu" href="" rel="noindex,nofollow">
            [...]
</li>

Upvotes: 0

Views: 953

Answers (1)

SLaks
SLaks

Reputation: 887275

.find searches the descendants of the elements in your set.

Your HTML probably has <li> elements as the top level, so .find won't find them.

If so, you can use .filter, which searches the elements themselves, and not their descendants.

Alternatively, you can wrap the HTML in a dummy element to turn all of the elements into descendants.

Upvotes: 4

Related Questions