Cómo recorrer los datos de jason y mostrarlos en la etiqueta de la lista de datos (dl)

Estoy intentando recorrer algunos datos JSON (var mydata) y mydata es una matriz de dos elementos, el segundo elemento de la matriz

mydata[1] es una matriz multidimensional, necesito mostrar el primer elemento, es decir mydata[0] en un dt y mostrar elementos de mydata [1] en un dd dentro de eso.

Probé todas las opciones pero estoy realmente atascado y necesito ayuda con esto. A continuación está mi código:

 var mydata = [ [{ "id": "67", "name": "Baby & Toddler Clothing " }, { "id": "68", "name": "Kids' Clothing, Shoes & Accessories" }, { "id": "69", "name": "Costumes, Reenactment Theater" }], [ [{ "id": "572", "name": "Baby Clothing Accessories " }, { "id": "573", "name": "Baby Shoes" }], [{ "id": "579", "name": "Boys Clothing [Sizes 4 & Up] " }, { "id": "580", "name": "Boys Shoes" }], [{ "id": "588", "name": "Costumes" }, { "id": "589", "name": "Reenactment & Theater " }] ] ] function getCategories(id){ $.ajax({ url: '{$getcatUrl}', type: 'POST', data: {category_id: id}, success: function (data) { data = jQuery.parseJSON(data); //console.log(data); return; if(data.length > 0){ firstdata = data[0]; secdata = data[1]; for(var i = 0; i < firstdata.length; i++) { level_1 = firstdata[i].name; level_1_id = firstdata[i].id; for(var j = 0; j< secdata.length; j++){ if(secdata[i][j] !== undefined){ level_2=''; level_2 = secdata[i][j].name; level_2_id = secdata[i][j].d; } console.log(level_2); } var dldata = $( '
'+ "
" + level_1 + "
"+ "
" + level_2 + "
"+ '
' ); } }else{ console.log('no item for this categories'); } }, error: function(jqXHR, errMsg) { // handle error console.log(errMsg); } }); }

El var level_1 y level_1_id funciona bien, pero sigo recibiendo error para la variable level_2, el error dice que no se puede leer la propiedad ‘name’ de undefined, se apreciará cualquier solución a este problema y también estoy abierto a nuevas ideas sobre hacerlo mejor ,

Básicamente, el problema es que sobrescribe las variables level_1 y level_2 cada vez for se ejecutan los bucles for . Por lo tanto, cuando llega al código que crea el código HTML, se sobrescriben varias veces y solo queda la última versión, y solo se imprime una vez en cualquier caso.

Esto lo resolverá, en este caso, generando los elementos HTML directamente dentro de cada ciclo, aunque por supuesto podría hacerlo agregando una variable y luego generando todo al final, si esa es su preferencia.

 var data = [ [{ "id": "67", "name": "Baby & Toddler Clothing " }, { "id": "68", "name": "Kids' Clothing, Shoes & Accessories" }, { "id": "69", "name": "Costumes, Reenactment Theater" }], [ [{ "id": "572", "name": "Baby Clothing Accessories " }, { "id": "573", "name": "Baby Shoes" }], [{ "id": "579", "name": "Boys Clothing [Sizes 4 & Up] " }, { "id": "580", "name": "Boys Shoes" }], [{ "id": "588", "name": "Costumes" }, { "id": "589", "name": "Reenactment & Theater " }] ] ] if (data.length > 0) { var content = $("#content"); firstdata = data[0]; secdata = data[1]; for (var i = 0; i < firstdata.length; i++) { var dl = $("#content").append("
"); dl.append("
" + firstdata[i].name + ""); for (var j = 0; j < secdata.length; j++) { if (secdata[i][j] !== undefined) { dl.append("
" + secdata[i][j].name + "
"); } } } content.append(dl); } else { console.log('no item for this categories'); }