JSFiddle - React, Tailwind, and code Playground

HTML

<pre id="data">
</pre>

JavaScript

var xmlString = '<?xml version="1.0" encoding="ISO-8859-1"?>' +
'<bookstore xmlns="http://example.com/domain">' +
'<book category="COOKING">' +
'  <title lang="en">Everyday Italian</title>' +
'  <author>Giada De Laurentiis</author>' +
'  <year>2005</year>' +
'  <price>30.00</price>' +
'</book>' +
'<book category="CHILDREN">' +
'  <title lang="en">Harry Potter</title>' +
'  <author>J K. Rowling</author>' +
'  <year>2005</year>' +
'  <price>29.99</price>' +
'</book>' +
'<book category="WEB">' +
'  <title lang="en">XQuery Kick Start</title>' +
'  <author>James McGovern</author>' +
'  <author>Per Bothner</author>' +
'  <author>Kurt Cagle</author>' +
'  <author>James Linn</author>' +
'  <author>Vaidyanathan Nagarajan</author>' +
'  <year>2003</year>' +
'  <price>49.99</price>' +
'</book>' +
'<book category="WEB">' +
'  <title lang="en">Learning XML</title>' +
'  <author>Erik T. Ray</author>' +
'  <year>2003</year>' +
'  <price>39.95</price>' +
'</book>' +
'</bookstore>';

var xPathString = "//book";

$.ajax({
    url: "/echo/xml/",
    type: 'POST',
    data: {
        xml: xmlString
    }
}).done(function(data) {
    var jah = xpath(data, xPathString);
    for (var i = 0; i < jah.snapshotLength; i++) {
        $('#data').append(
        $('<div />').text(
        $('<div />').append(
        $(jah.snapshotItem(i)).clone()).remove().html()).html()).append("\r\n");
    }
})

function xpath(xml, path) {
    if (window.ActiveXObject) {
        return xml.selectNodes(path);
    }
    // code for Mozilla, Firefox, Opera, etc.
    else if (document.implementation && document.implementation.createDocument) {
        var nsResolver = xml.createNSResolver(xml.documentElement);
        return xml.evaluate(path, xml, nsResolver, XPathResult.ORDERED_NODE_SNAPSHOT_TYPE, null);
    }
}