title: How can I show information from a JSON in HTML in a readable manner without knowing its structure and data?
body: <p>I have a JSON but I don't know its structure (the key/value pairs that are coming in), and I need to show that info in html. I parse the string that is coming, and loop it to be able to show the info on the page in a nice manner.</p>
  
  <pre><code>&lt;script type="text/javascript" language="JavaScript"&gt;
    var jsonString = '#{CertificadoBean.certificado.resumen}';
    var myObj = JSON.parse(jsonString);
  
    for ( var x in myObj) {
        if (myObj[x] instanceof Array) {
            document.getElementById("json").innerHTML += "&amp;lt;p&gt;" + "" + "&amp;lt;b&gt;" + x + "&amp;lt;/b&gt;" + ": "+JSON.stringify(myObj[x]);
        }
        else {
            document.getElementById("json").innerHTML += "&amp;lt;p&gt;" + "" + "&amp;lt;b&gt;" + x + "&amp;lt;/b&gt;" + ": " + myObj[x];
        }
    }
  &lt;/script&gt;
  </code></pre>
  
  <p>However in some cases it'll print out this:</p>
  
  <pre><code>Nivel matriculado: 10
  
  Periodo matriculado: 2019-02
  
  Periodos matriculados: 10
  
  Cursos pendientes:[{"Cod.":"NIP01","Nivel":9},{"Cod.":"NI043","Nivel":10},{"Cod.":"ALE10","Nivel":10}]
  
  </code></pre>
  
  <p>I have a problem with displaying the info a nice manner when the loop finds an array in the json, and I'm not sure how to properly loop the array to display in a legible manner like the rest of the object. </p>
  
  <p>How do I make Cursos pendientes show nicely like the others?</p>