Ok what I am trying to do is create a dynamic menu based on an array
First dimesion elements will be top level and Second dimension levels will be sub items of said parent how will I do this?
$(document).ready(function(e) {
//var maxLevels = 3;//Max Levels Of The List TO Traverse
var nav = new Array();
nav[0] = "Item A";
nav[0][0] = "Item AB";
nav[1] = "Item B";
nav[1][0] = "Item BA";
var menu = "";
nav.forEach(function(e) {
menu += "<li>" + e + "</li>";
});
$('#info').html(menu);
});
Having declared your array
navyou can access its elements withnav[index]but you can’t add a second dimension to item 0 just by sayingnav[0][0]– you need to declarenav[0]as an array before using it:But you can declare it all in one statement with an array literal, where for your purpose I’d suggest an array of objects:
If your desired output was this:
You could do it like so:
Demo: http://jsfiddle.net/9kRs3/
Of course you could build the menu up as a string like in your original code, but I’ve chosen to create the elements as I go.
Using the object structure above you can easily add some extra properties to define what happens when each item is clicked. And you could make each item in the submenu arrays have the same object structure as the top level so that you can nest more and more levels as needed.