The JSON I'm requesting is an array within an array (I think) and looks like this:
"results": {
"collection1": [
{
"Inches": "1\"",
"Resort": "Keystone",
"index": 1,
"url": "http://extras.denverpost.com/skireport/colorado/recentsnow.html"
},
{
"Inches": "0\"",
"Resort": "Breckenridge",
"index": 2,
"url": "http://extras.denverpost.com/skireport/colorado/recentsnow.html"
},
{
"Inches": "0\"",
"Resort": "Telluride",
"index": 3,
"url": "http://extras.denverpost.com/skireport/colorado/recentsnow.html"
},
I am trying to display this information in a list, but I get an 'Undefined' result list with the following JQuery:
$.ajax({
url:"www.kimonolabs.com/api/5qtdkod0apikey=z6vewKq5SXBcF6Q6L17sQEJ8gaYMou0C",
crossDomain: true,
dataType: "jsonp",
'success': function (response) {
$(".panel-heading").html(response.name);
//Puts the API name into the panel heading
var collection = response.results.collection1;
for (var i = 0; i < collection.length; i++){
$(".list-group").append('<li class="list-group-item">' +
collection[i].resort.inches + '</li>');
//when I just try to bring in either resort or inches I get an 'undefined' list-- when I try to add both (e.g resort.inches) I don't get any results
}
}
});
What's the best way to define the resort and inches data and display it in the "list-group-item" list. Here's a fiddle: http://jsfiddle.net/6w0sdctg/