I want to extract data using jQuery XML parsing tools, but it doesn't work and seems to block when it comes to ".find('...').each(..."

Question

Here's my code:

I followed what I Web site suggested to do and I ended up with my script not working properly! And even Firebug doesn't show any error.

$(document).ready(function() {
                $.ajax({
                        type: "GET",
                        url: "server.xml",
                        dataType: "xml",
                        complete : function(data, status) {
                            var products = data.responseXML;

                            $(products).find('product').each(function(){
                                var id = $(this).attr('id');
                                var name = $(this).find('name').text();
                                var price = $(this).find('price').text();
                                alert("id:" + id + " ; name:" + name + " ; price:" + price);
                            });

                        }
                });
            });

Here's the XML file:

I also put the same thing as in their example:

<?xml version="1.0" encoding="UTF-8"?> <products> <product id="1"> <name>Eau</name> <price>10</price> </product> <product id="2"> <name>Pain</name> <price>0.70</price> </product> <product id="3"> <name>Gateaux</name> <price>5</price> </product> </products>

Everything seems to be blocking when it reaches "$(xml).find('...').each(function() {});" and I can't seem to be able to find a way to resolve. Any help would be appreciated. Thanks guys.

Answer 1

                        var products = data.responseXML;

jQuery already returns responseXML:

var ct = xhr.getResponseHeader("content-type") || "",
xml = type === "xml" || !type && ct.indexOf("xml") >= 0,
data = xml ? xhr.responseXML : xhr.responseText;

Try just manipulating data directly.