iterate over array of json with jquery

Question

I know this may seem basic to some of you, but I am trying to iterate a json object with jquery, how to reach to each webpage name of each producer. Please help! on the bottom is my code any help is welcome.

{
    "producers": [
        {
            "producer": {
                "id": "1",
                "name": "Radosa",
                "address": " Grenvägen 1-3",
                "zipcode": " 577 39",
                "district": " Hultsfred",
                "webpage": [
                    {
                        "name": "waste",
                        "purpose": "sample "
                    },
                    {
                        "name": "Ultra Worker",
                        "purpose": "Posao"
                    }
                ],
                "logoURL": "../producenter/images/ema.png",
                "latitude": "57.4999",
                "longitude": "15.828"
            }
        },
        {
            "producer": {
                "id": "2",
                "name": "Marko",
                "address": " Grenvägen 1-3",
                "zipcode": " 577 39",
                "district": " Hultsfred",
                "webpage": [
                    {
                        "name": "Sample name",
                        "purpose": "sample purpose"
                    },
                    {
                        "name": "Sample name",
                        "purpose": "sample purpose"
                    }
                ],
                "logoURL": "../producenter/images/ema.png",
                "latitude": "57.4999",
                "longitude": "15.828"
            }
        }
    ]
}


$.each(data.producers, function(key, value) {
        console.log(value.producer); ------ this works,
        console.log(value.webpage.name); ------ this don't work. How to reach this value?
    });

Answer 1

console.log(value.webpage.name);

should be

// webpage is an array too, get the first element of it for example
console.log(value.producer.webpage[0].name);

Answer 2

say your json object is data

try this

 $.each(data.producers,function(i,v){
     $.each(v.producer.webpage,function(i1,v1){ //<--since webpage is an array, use each again...
         alert(v1.name);
     })
 });

or simply you can use index..

 $.each(data.producers,function(index,value){
    console.log(value.producer.webpage[0].name); //first name
     console.log(value.producer.webpage[0].name); //second name
 });

Answer 3

Since value.producer.webpage is an array you need to:

for(var i=0; i<value.producer.webpage.length; i++) {
   var webpage = value.producer.webpage[i];
   console.log(webpage.name);
}

Answer 4

Sou can do that like this:

for(var producer in Object.producers){
    if(Object.producers.hasOwnProperty(producer)  && Object.producers[producer].webpage!==undefined){
        for(var i=0; i<Object.producers[producer].webpage.length; i+=1){
          // Your further code here
        }
    }
}