Question

I have a JSON file that will provide data on 15 cities like so:

"New York": {
    "total": 121,
    "shameless": 16,
    "honorable": 105,
    "index": 0.132
}

I have a div for every city:

<p class="pin newyork" id="New-York">
    New York
</p>

I need to parson the JSON file and identify what city it is, in this case it is New York, then get the ‘index’ associated with that city.

If the index is less than .33 it should addClass “barely”, if it is less than .66 addClass “fairly” and anything above .66 addClass “totally”. Which should look like this:

var shamelessIndex;

if (shamelessIndex < .33 ){
    $(".shamerating").addClass("barely");
}
else if (shamelessIndex < .66){
    $(".shamerating").addClass("fairly");
}
else {
    $(".shamerating").addClass("totally");
}

I have a function pulling in the data, I’m just not sure how to parse it to match the city with the DIV?

function dataStore(dataObj) {
    $.each(dataObj, function(key, value) {
        console.log(key);
        console.log(value.index);
    });
}

Answer 1

Assuming you are simply replacing spaces in the city name with hyphens to get the id, try this:

$.each(dataObj, function(key, value) {
    var $city = $("#" + key.replace(' ', '-'));
    var shamelessIndex = value.shameless;
    // do stuff with shameless index here...
});