XML parsing with namespaces using jQuery/JavaScript

So many times XML will come with namespaces specially when data comes from web service.
Developers get confused to handle that data using jQuery/Javascript.
I was the same who was suffering from this type of problem.
Here i am sharing my way to handle this.

I used following js for this.

<script src="http://code.jquery.com/jquery-1.9.1.js" type="text/jscript"></script>
<script src="http://code.jquery.com/jquery-migrate-1.2.1.js" type="text/jscript"></script>
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js" type="text/jscript"></script>

Demo xml:

<SearchResponse>
<SearchResult>
<a:BookingRequest.DetailsSearch>
 <a:ErrorMessage i:nil="true"/>
 <a:Name>Sydney, Australia</a:Name>
 <a:Number>1</a:Number>
 <a:Url>test.aspx?City=Sydney&Country=Australia</a:Url>
 <a:type>City</a:type>
 </a:BookingRequest.DetailsSearch>
<a:BookingRequest.DetailsSearch>
 <a:ErrorMessage i:nil="true"/>
 <a:Name>Sydney, Canada</a:Name>
 <a:Number>2</a:Number>
 <a:Url>test.aspx?City=Sydney&Country=Canada</a:Url>
 <a:type>City</a:type>
 </a:BookingRequest.DetailsSearch>
<a:BookingRequest.DetailsSearch>
 <a:ErrorMessage i:nil="true"/>
 <a:Name>North Sydney, Canada</a:Name>
 <a:Number>3</a:Number>
 <a:Url>test.aspx?City=North Sydney&Country=Canada</a:Url>
 <a:type>City</a:type>
 </a:BookingRequest.DetailsSearch>
<a:BookingRequest.DetailsSearch>
 <a:ErrorMessage i:nil="true"/>
 <a:Name>North Sydney, Australia</a:Name>
 <a:Number>4</a:Number>
 <a:Url>test.aspx?City=North Sydney&Country=Australia</a:Url>
 <a:type>City</a:type>
 </a:BookingRequest.DetailsSearch>
</SearchResult>
</SearchResponse>

Here i am parsing the XML and storing the data into array.
Now you can use this array according to your requirement.
Here both the code i am sharing for IE and other browser.

Here is my code.

if ($.browser.msie && window.XDomainRequest) {
                if (window.XDomainRequest) {
                    var query = 'Your URL Here';
                    var xdr = new XDomainRequest();
                    if (xdr) {
                        xdr.onload = function () {
                            searchtext = request.term;
                            data = $.parseXML(xdr.responseText);
                            var item = [];
                            var pets = data.getElementsByTagName("a:BookingRequest.DetailsSearch");
                            var Name = data.getElementsByTagName("a:Name");
                            var Number = data.getElementsByTagName("a:Number");
                            var Url = data.getElementsByTagName("a:Url");
                            var type = data.getElementsByTagName("a:type");

                            for (var i = 0; i < pets.length; i++) {
                                var obj = { value: Name[i].textContent.toString(), URL: Url[i].textContent.toString(), Number: Number[i].textContent.toString(), Type: type[i].textContent.toString() };
                                item.push(obj);
                            }
                            response(item);
                        }
                        xdr.onerror = function () { /* error handling here */ }
                        xdr.open('GET', query);
                        xdr.send();
                    }
                }
            }
            else {
                var query = 'Your URL Here';
                $.ajax({
                    type: "GET",
                    crossDomain: true,
                    url: query,
                    contentType: "application/json; charset=utf-8",
                    dataType: "json",
                    success: function (data1) {
                        if (data1 != null) {
                            var data = data1.SearchResult;
                            var item = [];
                            for (var i = 0; i < data.length; i++) {
                                var obj = { value: data[i].Name, URL: data[i].Url, Number: data[i].Number, Type: data[i].type };
                                item.push(obj);
                            }
                            response(item);
                        }
                    },
                    error: function (response, textStatus, errorThrown) {
                        alert(errorThrown);
                    }
                });
            }
        }


Now if you want to directly bind these XML data into page then just use following

var count = 0;
$(data).find('SearchResult').each(function () {

    var Name = $(this).find('a\\:Name').text();
    var Number = $(this).find('a\\:Number').text();
    var Url = $(this).find('a\\:Url').text();
    var type = $(this).find('a\\:type').text();  
    count++;
});

I used count only to check number of occurrence of XML node.
You can use this value any way you like.

Hope this will help and save your time.
Happy coading...