К картинке стилей не привяжешь, здесь в примере это div class="ratehead".
.
<style>
.ratebox {
width: 200px;
}
.ratebox span {
display: block;
text-align: center;
padding: 3px 0;
font-weight: bold;
}
.current:before, .previous:before {
content: "$";
}
/*правила для знака доллара*/
.ratebox span:before {
margin-right: 10px;
}
/*общие правила для стрелок*/
.ratebox span:after {
margin-left: 10px;
}
/*правила для стрелки вверх*/
.up:after {
content: "▲";
color: #0f0; /*зеленый цвет*/
}
/*правила для стрелки вниз*/
.down:after {
content: "▼";
color: #f00; /*красный цвет*/
}
.ratehead {
background-color: #3CA0D9;
}
.ratehead * {
color: #fff;
}
.ratehead *:after {
color: #fff; /*белый цвет стрелки*/
}
</style>
<div class="ratehead"><span class="current"></span></div>
<div class="ratebox">
<span class="current"></span>
<span class="previous"></span>
</div>
<script>
$.getJSON("http://domain.ru", function(data) {
$.each(data, function(k, o) {
$('.'+k).text(o.value).addClass(['down','up'][o.rate])
})
});
</script>
