Iterating thorough JSON with jQuery/Javascript

Question

I am trying to fill a table with JSON data. When I run the following script I get only the last entry of 10. I must have to do some sort of .append() or something. I've tried to put this in but it just returns nothing.

$(function() {
  $('#ReportedIssue').change(function() {
    $.getJSON('/CurReport/GetUpdatedTableResults', function(json) {
      //alert(json.GetDocumentResults.length);
      for (var i = 0; i < json.GetDocumentResults.length; i++) {
        $('#DocumentInfoTable').html(
          "<tr>" +
          "<td>" + json.GetDocumentResults[i].Document.DocumentId + "</td>" +
          "<td>" + json.GetDocumentResults[i].Document.LanguageCode + "</td>" +
          "<td>" + json.GetDocumentResults[i].ReportedIssue + "</td>" +
          "<td>" + json.GetDocumentResults[i].PageNumber + "</td>" +
          "</tr>"
        )
      };
    });
  });
});

Thank you,

Aaron

Answer 1

Your code has the following:

$('#DocumentInfoTable').html(...);

which replaces the html content every time you call it. Try replacing that with:

$('#DocumentInfoTable').append(...);