title: reading data from json file and displaying them on html page
body: <p>I have a json file like this :</p>
  
  <pre><code>[
   {
   "X_id": [ "id1" ],
  "contents.value": [ "AA" ],
  "contents.count": [ 95 ] 
  },
  {
   "X_id": [ "id2" ],
  "contents.value": [ "BB" ],
  "contents.count": [ 41 ] 
  },
  {
   "X_id": [ "id3" ],
  "contents.value": [ "CC" ],
  "contents.count": [ 36 ] 
  },
  {
   "X_id": [ "id4" ],
  "contents.value": [ "DD" ],
  "contents.count": [ 4 ] 
  },
  {
   "X_id": [ "id5" ],
  "contents.value": [ "EE" ],
  "contents.count": [ 33 ] 
  }
  ]
  </code></pre>
  
  <p>and I want to display this values on my html page, and for the test I try first to show them in console :</p>
  
  <pre><code>$.getJSON("example.json", function(data) {})
      .done(function(data) {
         $.each(data.items, function(i, item) {
              console.log(item.contents.value);
          }); 
      })
      .fail(function() {
          console.log("error");
      })
      .always(function(data) {
          console.log(data);
      });
  </code></pre>
  
  <p>but I get this error message :</p>
  
  <blockquote>
    <p>TypeError: a is undefined     </p>
    
    <p>...rCase()},each:function(a,c,d){var
    e,f=0,g=a.length,h=g===b||p.isFunction(a);if(d...</p>
  </blockquote>
  
  <p>How can I solve this problem ?</p>