Attempting to Display Data from JSON Feed in HTML

JavaScript
1

Working on a project now where I need to grab data from a JSON feed then display some of that data within the HTML of a page at another domain. The URL for the feed is formatted like this:

http://www.marknine.com/feeds/spotprices?uid=a9134ade-d635-4b8c-a178-5f12f33816y0

And the results are like this:

{
  "SpotPrices": [
    {
      "Commodity": "Gold",
      "SpotBid": 1582.9,
      "SpotAsk": 1583.6,
      "SpotChange": 4.9,
      "UpdateDate": "/Date(1341609365407)/"
    },
    {
      "Commodity": "Silver",
      "SpotBid": 27.07,
      "SpotAsk": 27.11,
      "SpotChange": 0.165,
      "UpdateDate": "/Date(1341609365470)/"
    },
    {
      "Commodity": "Platinum",
      "SpotBid": 1442,
      "SpotAsk": 1445,
      "SpotChange": -1.5,
      "UpdateDate": "/Date(1341609365550)/"
    },
    {
      "Commodity": "Palladium",
      "SpotBid": 576,
      "SpotAsk": 579,
      "SpotChange": 0.05,
      "UpdateDate": "/Date(1341609365610)/"
    }
  ]
}

The jQuery code I am using to try to display some of this data looks like this:

$.getJSON("http://www.marknine.com/feeds/spotprices?uid=a9134ade-d635-4b8c-a178-5f12f33816y0",
	function(data){
	  $.each(data.SpotPrices, function(i,SpotPrices){
		content = '<td>' + SpotPrices.Commodity + '</td>';
		content += '<td>' + SpotPrices.SpotBid + '</td>';
		$(content).appendTo("#spotPricesActual");
	  });
	});

Yet nothing happens on the page to show that any data is displaying or that it is even getting the data at all. If it helps anything there’s also no error messages showing either. Am I missing a really important chunk here? Or is there just one little thing that needs to be changed?

2 

var json =  {
  "SpotPrices": [
    {
      "Commodity": "Gold",
      "SpotBid": 1582.9,
      "SpotAsk": 1583.6,
      "SpotChange": 4.9,
      "UpdateDate": "/Date(1341609365407)/"
    },
    {
      "Commodity": "Silver",
      "SpotBid": 27.07,
      "SpotAsk": 27.11,
      "SpotChange": 0.165,
      "UpdateDate": "/Date(1341609365470)/"
    },
    {
      "Commodity": "Platinum",
      "SpotBid": 1442,
      "SpotAsk": 1445,
      "SpotChange": -1.5,
      "UpdateDate": "/Date(1341609365550)/"
    },
    {
      "Commodity": "Palladium",
      "SpotBid": 576,
      "SpotAsk": 579,
      "SpotChange": 0.05,
      "UpdateDate": "/Date(1341609365610)/"
    }
  ]
}
$.each(json.SpotPrices, function(i,v){
  content = '<tr>';
  content += '<td>' + json.SpotPrices[i].Commodity + '</td>';
  content += '<td>' + json.SpotPrices[i].SpotBid + '</td>';
  content += '</tr>';
  $(content).appendTo("#spotPricesActual");
});

just a little tip use console.log to debug your script
so you can easily catch what is going wrong.

3

Thanks. So I keep everything I have and add the PHP chunk you’ve included that looks like it’s repeating the existing JSON and jQuery code and that will get the live feed working on my site?