title: Adding new data from JSON to existing table
body: <p>I am trying to add new data (from JSON) to existing table (using jquery).</p>
  
  <p>In my html I have this table for example:</p>
  
  <pre><code>&lt;table data-role="table" data-mode="columntoggle" class="ui-responsive" data-column-btn-text="Filter Columns" id="MyTable"&gt;
    &lt;thead&gt;
      &lt;tr&gt;
        &lt;th data-priority="1"&gt;A&lt;/th&gt;
        &lt;th data-priority="2"&gt;B&lt;/th&gt;
        &lt;th data-priority="3"&gt;C&lt;/th&gt;
      &lt;/tr&gt;
    &lt;/thead&gt;
    &lt;tbody&gt;
      &lt;tr&gt;
        &lt;td&gt;a1&lt;/td&gt;
        &lt;td&gt;b1&lt;/td&gt;
        &lt;td&gt;c1&lt;/td&gt;
      &lt;/tr&gt;
    &lt;/tbody&gt;
    &lt;/table&gt;
  </code></pre>
  
  <p>I am trying to do this (for adding new data from JSON):</p>
  
  <pre><code>var response = [{
        "A":"a2",
        "B":"b2",
        "C":"c2"
       },
       {
        "A":"a3",
        "B":"b3",
        "C":"c3"
      },
      {
        "A":"a4",
        "B":"b4",
        "C":"c4"
      }];
  
      $.each(response, function(i, item) {
                  $('&lt;tr&gt;').html(
                  //"&lt;tr&gt;" +
                  "&lt;td&gt;" + response[i].A + "&lt;/td&gt;&lt;td&gt;" + response[i].B + "&lt;/td&gt;&lt;td&gt;" + response[i].C + "&lt;/td&gt;" + "&lt;/tr&gt;").appendTo('#MyTable');
          });
  </code></pre>
  
  <p>Why doesn't it work?</p>