Add Leaflet layer based on variable with the same name?

Question

I have a geojson layer named mapLayers and another geojson layer named lmiCounties, with a dropdown list with an item with the id lmiCounties. I want the second layer added to the first, which has already been added to the map when a user clicks on this item, and I want to do this with a function since I will have several layers/list items. The click capture is fine, its just that layer[0] (lmiCounties) does not associate with the actual lmiCounties geoJson layer. Seems like I am missing something simple here.

var lmiCounties = L.geoJson('some data');

document.getElementById('chooser').addEventListener("click", function(e) {
  mapLayers.clearLayers();
  layer = [e.target.id];
  console.log(layer[0]);
  mapLayers.addLayer(layer[0]);
  e.preventDefault();
});

Answer 1

the variable layer will contain the e.target.id which is not a layer, I presume you have a table named layer somewhere and you want to get the layer with the index e.target.id

to do so:

var index=e.target.id;
layer[index].addTo(mapLayers);

If this is actually what you want to make

Answer 2

The layer that is to be toggled needs to be a global variable, thus making it available to the window[ ] object see here. I was creating the layer inside a function. I simply created the empty variables at the beginning of the script and it works.

document.getElementById('chooser').addEventListener("click", function(e) {
  mapLayers.clearLayers();
  layer = window[e.target.id];
  console.log(layer._leaflet_id);//to check if it is capturing the map layer
  mapLayers.addLayer(layer);
  e.preventDefault();
});