How to fix “Cannot read property ' ' of undefined” error when working with JSON and JavaScript?

Question

JavaScript

I work with JSON through a JavaScript script. JSON file:

{
  "section_1" : {
    "1_1" : {
      "name" : "№1",
      "description" : "",
      "image" : "images/1_1.jpg"
    },
    "1_2" : {
      "name" : "№2",
      "description" : "",
      "image" : "images/1_2.jpg"
    }
  },
  "section_2" : {
    "2_1" : {
      "name" : "№3",
      "description" : "",
      "image" : "images/2.jpg"
    }
  }
}

js file:

$.getJSON('./MyJSON.json', function (data) {
        var out = '';
        for (var section in data){ // вывод всех товаров
            for (var key in section){
                out+='<img src="'+data[section][key].image+'" alt="">';
                out+='<h5>'+data[section][key]['name']+'</h5>';
                if (data[section][key]['description'] != "") {
                    out+='<p>'+data[section][key]['description']+'</p>';
                }
            }  
        }
    });

When loading the page and accessing the values ​​of objects, the console gives the following error (screenshot is also attached): Cannot read property 'image' of undefined. Screen is attached.

Tell me, please, what am I doing wrong?

Answer 1

for (var section in data) {
  for (var key in data[section]) {
    ...
  }
}