title: Getting JSON to work with JQuery over REST?
body: <p>I am a python programmer, so am unsure how to do this in JavaScript.</p>
  
  <p><strong>Example input</strong> (from a REST service providing JSON):</p>
  
  <pre><code>[{"name": "foo", "id": 1024}, {"name": "bar", "id": 1025}]
  </code></pre>
  
  <p><strong>Output</strong>:</p>
  
  <pre class="lang-html prettyprint-override"><code>&lt;table&gt;
      &lt;thead&gt;
              &lt;tr&gt;&lt;th&gt;name&lt;/th&gt; &lt;th&gt;id&lt;/th&gt;&lt;/tr&gt;
      &lt;/thead&gt;
      &lt;tbody&gt;
              &lt;tr&gt;&lt;td&gt;foo&lt;/td&gt; &lt;td&gt;1024&lt;/td&gt;&lt;/tr&gt;
              &lt;tr&gt;&lt;td&gt;bar&lt;/td&gt; &lt;td&gt;1025&lt;/td&gt;&lt;/tr&gt;
      &lt;/tbody&gt;
  &lt;/table&gt;
  </code></pre>
  
  <p><strong>Attempt</strong> (this is as far as I've gotten, trying just with the list example first from the <a href="http://api.jquery.com/jQuery.getJSON/" rel="nofollow">JQuery docs</a>, before trying to make it a table):</p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html&gt;
      &lt;head&gt;
          &lt;script src="http://code.jquery.com/jquery-latest.js"&gt;&lt;/script&gt;
      &lt;/head&gt;
      &lt;body&gt;
          &lt;ul class="my-new-list"&gt;&lt;/ul&gt;
          &lt;script&gt;
            $.getJSON('http://www.servicestack.net/ServiceStack.Northwind/customers?format=json', function(data) {
            var items = [];
  
            $.each(data, function(key, val) {
              items.push('&lt;li id="' + key + '"&gt;' + val + '&lt;/li&gt;');
            });
  
            $('&lt;ul/&gt;', {
              'class': 'my-new-list',
              html: items.join('')
            }).appendTo('body');
          });
          &lt;/script&gt;
      &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>I'm sure it's just some n00bish mistake on my part, but unsure what it is. Could you please point it out?</p>
  
  <p>Preferably I would like a python-like view with dictionary syntax (maybe <a href="http://handlebarsjs.com/" rel="nofollow">Handlebars</a> can provide this?), so that I can just go <code>for person in this_list: &lt;tr&gt;person.name&lt;/tr&gt;</code>.</p>