title: loading images from json file with jquery
body: <p>So I have a json file which now loads text and images individually pretty fine, this is just a simple example of what I did to test if it would work:</p>
  
  <pre><code>  outputc+="&lt;li&gt;"
    outputc+=this.name+" "+this.price+"&lt;/li&gt;";
    $('#featured').append(outputc);
    $("&lt;img/&gt;").attr('src',this.images).appendTo('#featured');
  </code></pre>
  
  <p>Using the above code works perfectly however i need for both of these to be wrapped with a list, so I did some searching and I found this:</p>
  
  <pre><code>$(document).ready(function(){
  
  //loading json file
  
  var url = "shoppingItems.json";
  
  $.getJSON(url,function(json){
  
  
      $.each(json.shoppingItem,function()
      {
          var output ='&lt;li&gt;&lt;img src= "'+this.images+'" alt ="'+this.name+'"&gt;&lt;/li&gt;';
      });
  
      $('.items').append(output);
  });
  });
  </code></pre>
  
  <p>The above jQuery doesn't bring back anything at all, there isn't anything wrong with my json file as it's been validated and the code works if I simply alert it. This is potentially something I must be doing wrong with my output script which I can't see.</p>
  
  <p>My JSON file can be found here: <a href="https://stackoverflow.com/questions/15789410/json-file-not-loading-or-showing-alerts">Json file not loading or showing alerts</a></p>