XML Parsing with jQuery

jQuery provides a clean way to parse and traverse XML files using the same selector syntax you use for HTML DOM manipulation.

Loading and Parsing an XML File

$.ajax({
    type: 'GET',
    url: 'data.xml',
    dataType: 'xml',
    success: function(xml) {
        $(xml).find('item').each(function() {
            var title = $(this).find('title').text();
            var desc = $(this).find('description').text();
            var link = $(this).attr('href');

            $('<div class="item">')
                .append('<h3>' + title + '</h3>')
                .append('<p>' + desc + '</p>')
                .appendTo('#results');
        });
    }
});

Example XML Structure (data.xml)

<?xml version="1.0" encoding="UTF-8"?>
<items>
    <item href="http://example.com/1">
        <title>First Item</title>
        <description>Description of first item</description>
    </item>
    <item href="http://example.com/2">
        <title>Second Item</title>
        <description>Description of second item</description>
    </item>
</items>

Note on cross-domain: XMLHttpRequest cannot load XML files from other domains (same-origin policy). Use a server-side proxy or JSONP for external data sources.