I am currently working on a stocks widget and I have a specific requirement. Whenever there is a change in value in the Change or Changeinpercent columns, I need to dynamically set the font color to red for a decrease (-) or green for an increase (+).
Here is the progress I've made so far: http://jsfiddle.net/thetuneupguy/r2Bca/
$(function() {
$.getJSON('http://query.yahooapis.com/v1/public/yql?q=SELECT%20*%20FROM%20yahoo.finance.quotes%20WHERE%20symbol%20in(%22GCF14.CMX%22%2C%22SIF14.CMX%22%2C%22PAH14.NYM%22%2C%22PLF14.NYM%22)&format=json&diagnostics=true&env=store%3A%2F%2Fdatatables.org%2Falltableswithkeys&callback=', function(data) {
console.log("data: ", data);
console.log(data.query.results.quote);
$.each(data.query.results.quote, function(key, obj){
var $tr = $('<tr/>', {'class': 'my-new-list'}).appendTo('#blk-1 table');
$tr.append($('<td/>').text(obj.Name || "--"));
$tr.append($('<td/>').text(obj.Ask || "--"));
$tr.append($('<td/>').text(obj.Bid || "--"));
$tr.append($('<td/>').text(obj.Change || "--"));
$tr.append($('<td/>').text(obj.ChangeinPercent || "--"));
});
});
});