JSFiddle - React, Tailwind, and code Playground

HTML

<body>

<input type="file" id="file-input" />
<FORM>
<INPUT TYPE="button" onClick="history.go(0)" VALUE="Obnovit">
</FORM>
<h3></h3>
<div id='wrapper'></div>
<table id="demo"></table>
<h3></h3>
<pre id="file-content"></pre>

</body>

CSS

table,th,td {
  border : 1px solid black;
  border-collapse: collapse;
}
th,td {
  padding: 5px;
}

JavaScript

function readSingleFile(e) {
    var file = e.target.files[0];
      if (!file) {
        return;
      }
    var reader = new FileReader();
    reader.onload = function(e) {
    var contents = e.target.result;
    displayFileContents(contents);
  };
  reader.readAsText(file);
}


function displayFileContents(contents) {
    var element = document.getElementById('file-content');
    element.innerHTML = htmlEscape(contents);
    generateHTMLOutput('wrapper', contents)   
}

function htmlEscape(str) {
    return String(str)
            .replace(/&/g, '&amp;')
            .replace(/"/g, '&quot;')
            .replace(/'/g, '&#39;')
            .replace(/</g, '&lt;')
            .replace(/>/g, '&gt;');
}

document.getElementById('file-input')
  .addEventListener('change', readSingleFile, false);


if (window.DOMParser) {
    parseXml = function(xmlStr) {
        return ( new window.DOMParser() ).parseFromString(xmlStr, "text/xml");
    };
} else if (typeof window.ActiveXObject != "undefined" && new window.ActiveXObject("Microsoft.XMLDOM")) {
    parseXml = function(xmlStr) {
        var xmlDoc = new window.ActiveXObject("Microsoft.XMLDOM");
        xmlDoc.async = "false";
        xmlDoc.loadXML(xmlStr);
        return xmlDoc;
    };
} else {
    parseXml = function() { return null; }
}

function generateHTMLOutput(wrapperId, contentasstring)
{
    var xmlDoc = parseXml(contentasstring);        
  var table="";

  var x = xmlDoc.getElementsByTagName("Knihovna");
  for (i = 0; i <x.length; i++) { 
    table += "<tr><th>Autor:</td><th>" +
    x[i].getElementsByTagName("Autor")[0].childNodes[0].nodeValue +
    "<tr><th>Název knihy:</td><th>" +
    x[i].getElementsByTagName("NazevKnihy")[0].childNodes[0].nodeValue +
   "<tr><th>Rok vydání:</td><th>" +
    x[i].getElementsByTagName("RokVydani")[0].childNodes[0].nodeValue +
    "<tr><th>Cena:</td><th>" +
    x[i].getElementsByTagName("Cena")[0].childNodes[0].nodeValue +
    "</td></tr>";

  }

 ...