Nested objects in javascript using bracket notation to dynamically create variables. Eventually will be repeated with AngularJS

Question

I'm trying to dynamically create javascript objects using bracket notation as demonstrated by the top answer here. I would hope to end up with similar objects to the following (though simply putting this javascript in gets an error on the bracket after sections as an "Unexpected Token"):

tabs[1]={
     sections[1]={
          children[1]={
               title:"Child1"
          }
          children[2]={
               title:"Child2"
          }
          children[3]={
               title:"Child3"
          }
     sections[2]={
          children[1]={
               title:"Child1"
          }
          children[2]={
               title:"Child2"
          }
     }
};
tabs[2]={
     sections[1]={
          children[1]={
               title:"Child1"
          }
          children[2]={
               title:"Child2"
          }
     sections[2]={
          children[1]={
               title:"Child1"
          }
          children[2]={
               title:"Child2"
          }
     }
     sections[3]={
          children[1]={
               title:"Child1"
          }
          children[2]={
               title:"Child2"
          }
     }
};

Is a structure like this achievable? My attempt at achieving it is lower on the page. How can I make the above structure happen for my situation? With it, would I be able to do something like:

   var childTitle = tabs[1].sections[2].child[2].title

These objects will be created from arrays that are created from csv files (using jquery-csv. The elements in the arrays/csvs are tab names, side-nav section names, and side-nav-subsection names. I need to create them dynamically because these arrays are subject to change as the number and names of tabs and sections within the app change. Here is my attempt:

    this.tabData = tabsService.tabData;
    var tabCount = tabsService.tabData.length;
    var tabs={};

    for (tCounter = 0; tCounter<tabCount; tCounter++){


        tabs[tCounter] ={
            var tabURL ="Contents/Product Groups/"+this.tabData[tCounter]+"/sectionOrder.csv";  
            var TabSectionData = $.getCsvArray(tabURL);
            var sectionCount = TabSectionData.length;


            for (sCounter = 0; sCounter<sectionCount; sCounter++){
                var tabChildURL ="Contents/Product Groups/"+this.tabData[tCounter]+"/"+TabSectionData[sCounter]+"/order.csv";
                var TabChildData = $.getCsvArray(tabChildURL);

                sections[sCounter] ={
                    "title" = TabSectionData.[sCounter];
                    cCounter = 0;
                    for (cCounter = 0; cCounter<TabChildData.length; cCounter++){
                            children[cCounter]={
                            "title": TabChildData.[cCounter];

                            }
                        }
                    }
                }
        }

As a reference, the arrays in the code above may look something like:

tabData=[Tab1, Tab2];
tabSectionData=[Section1, Section2];
tabChildData=[Child1, Child2, Child3];

though they are dynamically created everytime a csv file is read and subject to change.

Eventually, these elements will be repeated using AngularJS's ng-repeat similar to this post.

I attempted using arrays, but it ended up getting pretty complex and I couldn't get elements from a 3D array to repeat properly with angular. To see the navigation structure I'm going for and details on this attempt, please see this post I made yesterday.

The backend of the app updates the app.data folder on the users machine to have a specific folder structure with all of the app's content inside. The front end uses the csv files in these folders to navigate this folder structure and know the proper order to display content.

Thank you very much for your help. Your time is very appreciated. Let me know if there is anything more you need from me.