title: JSON Loop through nested array
body: <p>This is my JS ("data" is from the json call):</p>
  
  <pre><code>if (data.projectReports.length) {
    for (var i in data.projectReports){
      var report = data.projectReports[i];
      $('#reports').append(
          '&lt;div class="report-description"&gt;' +
            '&lt;h2&gt;' + report.header + '&lt;/h2&gt;' +
            '&lt;p&gt;' + report.text + '&lt;/p&gt;' +
          '&lt;/div&gt;' +
          '&lt;ul class=\"report-moreinfo\"&gt;' +
  
            // I want to loop through "persons" here.
  
          '&lt;/ul&gt;'
      );
    }
  } else
  
  . . .
  </code></pre>
  
  <p>This is my JSON:</p>
  
  <pre><code>{
    "projectReports":[
      {
        "header":"Headline",
        "text":"Description of item",
        "estimate":10,
        "actual":7,
        "persons":{
          "Robert":5,
          "Erik":10,
          "Juan":3
        }
      }
    ]
  }
  </code></pre>
  
  <p>I am new to JSON and after searching for an answer and actually finding a few different answers, new problems arose so I thought I would post the question in it's entirety here.</p>
  
  <p>Where the comment is in my JavaScript code, I want to loop through <code>report.persons</code>.</p>
  
  <p>In all of the solutions I found they could point directly to "header" or "text" like I have done before, but in this case I just have a key and value. How would I go about doing something like this?</p>
  
  <pre><code>&lt;li&gt;&lt;p&gt; persons.key &lt;/p&gt;&lt;p&gt; persons.value &lt;/p&gt;&lt;/li&gt;
  </code></pre>
  
  <p>I understand that I will have to do another <code>for</code> loop, but my knowledge isn't good enough to be able to figure out on my own how to construct it.</p>