title: Create contact table from JSON data
body: <p>I started a demonstration project on HTML, JSON and jQuery recently.
  Thing I want to achieve now is get data from the JSON file and load it into my table.
  I am new to JSON so it took me a day to get to nothing, the data was not loaded into my table.</p>
  
  <p>Here is my JSON file, 'contact.json':</p>
  
  <pre><code>{
      "length": 2,
      "info": [
          {
              "fullname":"Noob Here",
              "email":"myemail@server.com",
              "phone":"123456",
              "badgeid": "11111",
          },
          {
              "fullname":"Newbie There",
              "email":"hisemail@server.com",
              "phone":"589433",
              "badgeid": "11112",
          }
      ]
  }
  </code></pre>
  
  <p>My script to load data:</p>
  
  <pre><code>window.onload = function () {
      var contacts;
      setTimeout(loadData(contacts, "contact"), 2000);
      $(contacts.info).each(function(index, element){  
          $('#contacts').append('&lt;tr&gt;&lt;td&gt;' + element.fullname + '&lt;/td&gt;&lt;td&gt;'
              + element.email + '&lt;/td&gt;&lt;td&gt;'
              + element.phone + '&lt;/td&gt;&lt;td&gt;'
              + element.badgeid + '&lt;/td&gt;&lt;/tr&gt;');       
      })
  };
  
  function loadData(myobject, myfile){
      myobject = $.parseJSON("../data/" + myfile + ".json");
  };
  </code></pre>
  
  <p>Please notice that I may want to load from various JSON file, so loadData have some agruments there. Otherwise, it will parse JSON file directly.</p>
  
  <p>I already had a '#contact' table declared in HTML.
  The error console said:</p>
  
  <blockquote>
    <p>Uncaught SyntaxError: Unexpected token.<br>
        jQuery.extend.parseJSONjquery.min.js:442<br>
        loadDataHomepage.html:23<br>
        window.onload</p>
  </blockquote>
  
  <p>Why is this error appearing? How do I fix this problem?</p>