How to access nested array in JSON array using javascript or jQuery?

Question

I have a nested array which looks like the example code below.

I need to access a nested array within my JSON array.

But the issue is that I always get undefined!

var json = {
    "status": "OK",
    "tickets": {
        "open_tickets": [{
            "id": "2",
            "assets": [{
                "id": 2446,
                "age": 4,
    
            }]
        }, {
            "id": "3",
            "assets": [{
                "id": 244564646,
                "age": 28,
            }]

        }]
    }
};

for(i=0;i<json.tickets.open_tickets.length;i++){

var id = json.tickets.open_tickets[i].id;
var age = json.tickets.open_tickets[i].assets.age;

$('.holder').append('<p>'+id+' '+age+'</p>')
 

}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="holder">



</div>

The age variable is always undefined and I cant figure out why this is happening.

what am I doing wrong?

`.assets` is an array, so you need to use a loop or `.assets[0].age` to access the first item. — lusc, Mar 23 '23 at 16:57
@lusc im trying to access all of them. not just the first one though! — drago, Mar 23 '23 at 16:58
Then you need to loop `json.tickets.open_tickets[i].assets.length`. Here's a quick demo, though I'd probably use something more modern than this `for` - this demo keeps your existing style of using `i` for loop: https://jsfiddle.net/8jfsp43x/ — freedomn-m, Mar 23 '23 at 16:59
You're `json` variable doesn't contain JSON. It is a normal JavaScript object. See: [What is the difference between JSON and Object Literal Notation?](//stackoverflow.com/q/2904131) — 3limin4t0r, Mar 23 '23 at 17:06
Does this answer your question? [How can I access and process nested objects, arrays, or JSON?](https://stackoverflow.com/questions/11922383/how-can-i-access-and-process-nested-objects-arrays-or-json) — gre_gor, Mar 24 '23 at 06:07

score 1 · Answer 1 · answered Mar 23 '23 at 17:09

You can simplify this with a for Each loop to loop through json.tickets.open_tickets and access the assets array with [0].

let holder = document.querySelector(".holder");
var json = {
  "status": "OK",
  "tickets": {
    "open_tickets": [{
      "id": "2",
      "assets": [{
        "id": 2446,
        "age": 4,

      }]
    }, {
      "id": "3",
      "assets": [{
        "id": 244564646,
        "age": 28,
      }]

    }]
  }
};

json.tickets.open_tickets.forEach((e) => {
  holder.innerHTML += '<p>' + e.id + ' ' + e.assets[0].age + '</p>'
});

<div class="holder">



</div>

score 0 · Accepted Answer · answered Mar 23 '23 at 17:02

try this out:

for (var i = 0; i < json.tickets.open_tickets.length; i++) {
    var ticket = json.tickets.open_tickets[i];
    var id = ticket.id;
    var assets = ticket.assets;
    for (var j = 0; j < assets.length; j++) {
        var age = assets[j].age;
        $('.holder').append('<p>' + id + ' ' + age + '</p>');
    }
}

How to access nested array in JSON array using javascript or jQuery?

2 Answers2