jQuery Forum

Dear Commuity,

I have a question using jQuery.getJSON() to generate HTML from an existing data Source. the URL of the JSON output is www.pascalfendrich.net/test/?q=jsontest which produces the following String.

1. {
       "test":[
       {
           "item":
           {
               "field_datum":"Do 22.11.2012",
               "title":"Air",
                "field_support":"Oval"
           }
       },
       {
           "item":
           {
               "field_datum":"So 25.11.2012",
               "title":"S\u00e9bastien Tellier",
               "field_support":"Orange"
           }
       },
       {
           "item":
           {
               "field_datum":"Do 22.11.2012",
               "title":"Daft Punk",
               "field_support":"Justice"
           }
       }]
   }
   

To load the data from the server I use the following code which I adopted from the example at http://api.jquery.com/jQuery.getJSON.

1. $(document).ready(function(){
   
   $.getJSON('http://www.pascalfendrich.net/test/?q=jsontest', function(data) {
     var items = [];
   
     $.each(data, function(key, val) {
       items.push('
2. ' + val + '
');
  });

  $('
', {
    'class': 'my-new-list',
    html: items.join('')
  }).appendTo('body');
 
  $("Teststring").appendTo('body');
});

});

Unfortunately nothing happens. No HTML is produced, and nothing gets appended to the body tag. Since I am a newbie eith json and jQuery, I do not understand every detail of the Code, so probably the problem occurs because of an incorrect use of the Syntax in my JavaScript file.

Can anyone help me finding the error and give me hints how the correct Syntax would be? This would be much appreciated.

Thank you very much!