Declaring multiple gridoptions for multiple tabs, but new AGGRid not working

Question

I am trying to declare multiple gridoption variables (global variables), and when I try to create a new grid instance for each tab , using the corresponding Tab, it throws up some unspecified error. Here is the gridoption declaration:

var gridOptions_Tab =  {
  columnDefs: columnDefs,
  defaultColDef: defaultColDef,
  suppressAggFuncInHeader: true,
  animateRows: true,
  rowGroupPanelShow: 'always',
  pivotPanelShow: 'always',
  sideBar: true,
  asyncTransactionWaitMillis: 100,
  groupDefaultExpanded: -1,
  autoGroupColumnDef: {
    minWidth: 50,
    pinned: 'left',
    cellRendererParams: {
        suppressCount: true
    }
  },
  onGridReady: function (params) {
    createRowData(params);
  },
};


var gridOptions_Tab1 =  {
  columnDefs: columnDefs,
  defaultColDef: defaultColDef,
  suppressAggFuncInHeader: true,
  animateRows: true,
  rowGroupPanelShow: 'always',
  pivotPanelShow: 'always',
  sideBar: true,
  asyncTransactionWaitMillis: 100,
  groupDefaultExpanded: -1,
  autoGroupColumnDef: {
    minWidth: 50,
    pinned: 'left',
    cellRendererParams: {
        suppressCount: true
    }
  },
  onGridReady: function (params) {
    createRowData(params);
  },
};


var gridOptions_Tab3 =  {
  columnDefs: columnDefs,
  defaultColDef: defaultColDef,
  suppressAggFuncInHeader: true,
  animateRows: true,
  rowGroupPanelShow: 'always',
  pivotPanelShow: 'always',
  sideBar: true,
  asyncTransactionWaitMillis: 100,
  groupDefaultExpanded: -1,
  autoGroupColumnDef: {
    minWidth: 50,
    pinned: 'left',
    cellRendererParams: {
        suppressCount: true
    }
  },
  onGridReady: function (params) {
    createRowData(params);
  },
};


var gridOptions_Tab2 =  {
  columnDefs: columnDefs,
  defaultColDef: defaultColDef,
  suppressAggFuncInHeader: true,
  animateRows: true,
  rowGroupPanelShow: 'always',
  pivotPanelShow: 'always',
  sideBar: true,
  asyncTransactionWaitMillis: 100,
  groupDefaultExpanded: -1,
  autoGroupColumnDef: {
    minWidth: 50,
    pinned: 'left',
    cellRendererParams: {
        suppressCount: true
    }
  },
  onGridReady: function (params) {
    createRowData(params);
  },
};

Here is the code ceating the new Grid

function addAGGrid(tabName) {
  console.log('Creating grid options for ' + tabName);
  //globalGridOptions[tabName] = {
  //  gridOptions:gridOptions
  //};
  var selector = agGridPrefix + tabName;
  var eGridDiv = document.querySelector('#'+ selector);
  console.log('Queried for  ' + selector);
  console.log(eGridDiv);
  //console.log(globalGridOptions[tabName].gridOptions);
  console.log(window["gridOptions"+ "_" + tabName] );
  new agGrid.Grid(eGridDiv,window["gridOptions"+ "_" + tabName] );
  console.log(tabName);
  console.log(loadedGridSettings);
}

As you can see I am using window['gridOptions' + '_'+ tabName] to access that specific gridOptions variable, but the error I am getting is this: ErrorImage