JSFiddle - React, Tailwind, and code Playground

HTML

<!DOCTYPE html>
<html>
    
    <head>
        <script type="text/javascript">
            // XPATH STUFF
            function xpathPath(elm) {
                function pad(n, width, z) {
                    z = z || '0';
                    n = n + '';
                    return n.length >= width ? n : new Array(width - n.length + 1).join(z) + n;
                }

                var allNodes = document.getElementsByTagName('*');
                for (segs = []; elm && elm.nodeType == 1 || elm.nodeType == 3; elm = elm.parentNode) {
                    if (elm.nodeType == 3) {
                        var index = Array.prototype.indexOf.call(elm.parentNode.childNodes, elm);
                        segs.unshift("text()[" + pad((index + 1), 4) + "]");
                    } else if (elm.hasAttribute('id')) {
                        var uniqueIdCount = 0;
                        for (var n = 0; n < allNodes.length; n++) {
                            if (allNodes[n].hasAttribute('id') && allNodes[n].id == elm.id) uniqueIdCount++;
                            if (uniqueIdCount > 1) break;
                        };
                        if (uniqueIdCount == 1) {
                            if ("body" == elm.localName.toLowerCase()) {
                                segs.unshift("/xhtml:html/xhtml:body");
                            } else {
                                segs.unshift("id('" + elm.getAttribute('id') + "')");
                            }
                            return segs.join('/');
                        } else {
                            segs.unshift("xhtml:" + elm.localName.toLowerCase() + "[@id='" + elm.getAttribute('id') + "']");
                        }
                    } else {
                        for (i = 1, sib = elm.previousSibling; sib; sib = sib.previousSibling) {
                            if (sib.localName == elm.localName) i++;
                        };
                        segs.unshift("xhtml:" +...