Как считать цвет для каждого элемента?

Живой пример:

http://jsfiddle.net/ufaclub/asje4eu7/

    <script type="text/javascript">

    jQuery(document).ready(function(){

    var R = Raphael("mapPaper", 780, 463);

    var attr = {
        stroke: "#74675C",
        "stroke-width": 1,
        fill: "#FC0",
        "fill-opacity": 0.2
    },
    i = 1,
    area = {};

    var oAreas = $(".mapArea");

    $.each(oAreas, function(){
        area[i] = R.path($(this).attr("data-path")).attr(attr);
        i++;
    });

    for (var j=1; j<i; j++) {
        (function (o, j) {
            o[0].style.cursor = "pointer";
            o[0].onmouseover = function () {
                var color = "#FCE588";
                o.animate({fill:color}, 250);
            };
            o[0].onmouseout = function () {
                var color = "#FC0";
                o.animate({fill: color}, 250);
            };
            o[0].onclick = function () {
                var color = "#F00";
                o.animate({fill: color}, 250);
            };
        })(area[j], j);
    }

});

<div class="map" id="mapPaper">
    <div class="mapArea" data-path="M371,460,371,256,232,255,232,332,154,333,154,398,110,399,110,460z"></div>
    <div class="mapArea" data-path="M3,398,153,398,153,332,231,332,231,213,153,213,153,78,3,78z"></div>
    <div class="mapArea" data-path="M263,8,370,8,370,212,154,212,154,48,263,48z"></div>
    <div class="mapArea" data-path="M371,8,480,8,480,48,582,48,582,212,371,212z"></div>
    <div class="mapArea" data-path="M773,80,774,399,670,399,670,460,560,460,559,288,488,288,488,213,582,212,583,79z"></div>
</div>

Вот этот код задает цвет кисточки, что будет создавать фигуры

var attr = {
        stroke: "#74675C",
        "stroke-width": 1,
        fill: "#FC0",
        "fill-opacity": 0.2
    },
    i = 1,
    area = {};

А вот этот код считывает координаты в цикле из html-кода вида

var oAreas = $(".mapArea");

    $.each(oAreas, function(){
        area[i] = R.path($(this).attr("data-path")).attr(attr);
        i++;
    });

<div class="mapArea" data-path="M371,460,371,256,232,255,232,332,154,333,154,398,110,399,110,460z"></div>

МНЕ НУЖНО ЗАМЕНИТЬ ВОТ ЭТОТ КОД на другой:

var attr = {
        stroke: "#74675C",
        "stroke-width": 1,
        fill: "#FC0",
        "fill-opacity": 0.2
    },
    i = 1,
    area = {};

Код должен считывать данные аналогично data-path.

Например, назвать его status-path.

Пример HTML-кода:

<div class="mapArea" status-path='stroke: "#74675C", "stroke-width": 1, fill: "#FC0", "fill-opacity": 0.2' data-path="M371,460,371,256,232,255,232,332,154,333,154,398,110,399,110,460z"></div>

<div class="mapArea" status-path='stroke: "#423234", "stroke-width": 3, fill: "#FFF", "fill-opacity": 0.3' data-path="M435,450,371,256,342,255,3232,322,154,23,154,398,150,399,110,460z"></div>

...............................

и так далее.