problem looping through jquery .each with a multi array json file

I've seached high and low, and have had no luck finding the answer to this one.

I've got a json file that i'm using .each on. Have a look at the .json format - it's got a couple sub arrays:

http://heykoolaid.com/sections2.json

Here is the .html

http://heykoolaid.com/json_output.html

As you can see, it's just writing "[object Object]," as it runs through the arrays.

What am I doing wrong?

And how can i access the sub arrays ?

By now, I've pretty much got my head around this shizz, but i'm still lost when it comes to accessing the sub array data

Here is the code: (json)

{ "zones":[ {   "id":"arcade",  "zoneColor":"#ed08ef",  "sections":[        {           "sectionId":"arcade-145",           "name":"Arcade 145",            "coords":[[-32.36140331527542,43.2861328125],[-31.98944183792288,46.34033203125],[-29.80251790576445,46.5380859375],[-30.259067203213018,42.86865234375]],          "markers":[]        },      {           "sectionId":"arcade-146",           "name":"Arcade 146",            "coords":[[-30.977609093348676,37.08984375],[-33.06392419812064,37.177734375],[-32.41706632846281,42.6708984375],[-30.334953881988564,42.29736328125]],             "markers":[]        },      {           "sectionId":"arcade-147",               "name":"Arcade 147",            "coords":[[-31.034108344903498,36.40869140625],[-33.174341551002065,36.58447265625],[-33.5230788089042,33.8818359375],[-33.9433599465788,33.59619140625],[-33.26624989076273,33.15673828125],[-31.203404950917385,34.7607421875]],          "markers":[]        }   ] }, {  "id":"view-infield",    "zoneColor":"#0a1966",  "sections":[        {           "sectionId":"view-infield-305",                 "name":"View Infield 305",          "coords":[[-40.83043687764923,-40.0341796875],[-44.245199015221274,-36.18896484375],[-40.39676430557204,-29.6630859375],[-36.66841891894784,-33.37646484375]],          "markers":[]        },      {           "sectionId":"view-infield-307",                 "name":"View Infield 307",          "coords":[[-36.52729481454623,-44.560546875],[-40.17887331434696,-40.71533203125],[-36.42128244364948,-34.69482421875],[-32.56533316084102,-38.51806640625]],           "markers":[]        },      {           "sectionId":"view-开发者_开发问答infield-308",             "name":"View Infield 308",          "coords":[[-31.933516761903675,-49.02099609375],[-27.839076094777802,-43.06640625],[-32.082574559545904,-38.9794921875],[-35.97800618085566,-45.0439453125]],           "markers":[]        }   ] }, {  "id":"view-outfield",   "zoneColor":"#165604",  "sections":[        {           "sectionId":"view-outfield-333",                "name":"View Outfield 333",             "coords":[[60.45721779774397,36.6943359375],[56.58369172128337,47.373046875],[52.5897007687178,42.890625],[55.5161921571789,35.2001953125]],            "markers":[]        },      {           "sectionId":"view-outfield-334",                "name":"View Outfield 334",         "coords":[[56.353077613860826,48.0322265625],[52.656393941988,57.216796875],[52.03897658307622,57.7880859375],[49.48240137826932,50.4052734375],[52.32191088594773,43.52783203125]],            "markers":[]        },      {           "sectionId":"view-outfield-335",                "name":"View Outfield 335",             "coords":[[51.60437164681676,58.16162109375],[47.010225655683485,61.962890625],[44.276671273775186,54.7119140625],[49.081062364320736,50.82275390625]],             "markers":[]        },   {      "sectionId":"view-outfield-336",            "name":"View Outfield 336",         "coords":[[46.52863469527167,62.33642578125],[43.8186748554532,64.423828125],[40.94671366508002,57.216796875],[43.75522505306928,55.107421875]],        "markers":[]        }   ] }     ]   }

and the html:

<script type="text/javascript"> 
$(function() {
    $.getJSON("sections2.json", tickets);

    function tickets(data) {
        var htmlString = "";

        $.each(data.zones, function(index, value) {
            htmlString += item.sections + "<br/>";
        });

        $('#test').html(htmlString);

    }
});

---

If you know exactly what you need from the data structure then you can just descend though the struture, eg.

data.zones[i].sections[j].name  // Access known location in data structure

If you need to iterate, then jQuery's each() function is quite handy:

$.each(data, function (i, zone) {
    //do stuff with zone data eg. print zone.id

    $.each(zone.sections, function (j, section) {
        //do stuff with section data, eg. print section.name
    });
});

Or iterating using just JavaScript:

for (i in data.zones) {
    zone = data.zones[i];
    // print zone.id
    for (j in zone.sections) {
        section = zone.sections[j];
        // print section data
    }
}

---

you can use

$.each({arr},function(index, value){
       alert(index + ': ' + value); 

     }
    );

he $.each() function can be used to iterate over any collection, whether it is a map (JavaScript object) or an array

---

Please refer to the usage of the getJSON http://api.jquery.com/jQuery.getJSON/

I don't think you are passing the data to the success handler. If you follow the example from the link above, you should be in the right direction.

Success handler example:

$.getJSON('ajax/test.json', function(data) {
  $('.result').html('<p>' + data.foo + '</p>'
    + '<p>' + data.baz[1] + '</p>');
});

Your tickets(data) function is not getting the data after the getJSON completes.