Using Style to Control JavaScript Chart

HTML

<script src="http://static.fusioncharts.com/code/xt/5416/FusionCharts.js"></script>
<div id="heaven">God willing, chart should load here.</div>
<small>* The statistics are indicative and does not reflect the actual rate of attrition.</small>

CSS

body {
    font-family: "Verdana";
    font-size: 12px;
}

p {
    margin-top: 12px;
    margin-bottom: 6px;
}

JavaScript

var chart = new FusionCharts({
    id: "heavenly",
    type: "column2d",
    renderAt: "heaven",
    
    dataFormat: FusionChartsDataFormats.JSON,
    dataSource: {
        "caption": "Attrition Rate *",
        "subcaption": "Heaven 2012",
        "xAxisName": "Departmets{br}<small style=\"font-weight:normal;\">Click on the department name to know more</small>",
        "yAxisName": "Souls",
        "data": [
            {
                "label": "<a style=\"color:red;\" href=\"http://en.wikipedia.org/wiki/Gabriel_(archangel)\">Gabriel</a>", 
                 "value": "341110000"
            },
            {
                "label": "<a style=\"color:green;\" href=\"http://en.wikipedia.org/wiki/Michael_(archangel)\">Michael</a>", 
                "value": "194321000"
            },
            {
                "label": "<a style=\"color:blue;\" href=\"http://en.wikipedia.org/wiki/Raphael_(angel)\">Raphael</span>", 
                 "value": "9110021"
            }
        ]
    }
}).render();