title: Leaflet: How to toggle ALL layers either off or on at once?
body: <p><strong>Currently, I have my control set so users can toggle each layer they want to view. But, I am unsure how to build a "all layers off" and a "all layers on" function into my UI. I have over 70+ layers and it can get messy, hence why the need for a "master" on and off switch.</strong></p>
  
  <p>Demo <a href="http://jsfiddle.net/0pLwae33/3/" rel="noreferrer"><strong>fiddle here</strong></a></p>
  
  <blockquote>
    <p>I have a single geojson object that I am filtering to display markers
    on my map like so:</p>
  </blockquote>
  
  <pre><code>var myData = [{...}];
  
  var airport = L.geoJson(myData, {
  filter: function(feature) {
      switch (feature.properties.Subcategory) {
          case 'Airport': return true;
              break;
      }
  },
   onEachFeature: onEachFeature
  });
  
  var heliport = L.geoJson(myData, {
    filter: function(feature) {
      switch (feature.properties.Subcategory) {
          case 'Heliport': return true;
              break;
      }
  },
   onEachFeature: onEachFeature
  });
  
  ...
  ...
  ...
  and so on...
  </code></pre>
  
  <blockquote>
    <p>I was thinking of putting a button control at top right of the map page like
    so:</p>
  </blockquote>
  
  <pre><code>&lt;div id="toggle" style="display:none;"&gt;
  Toggle all layers:
  &lt;button type="button" class="btn btn-link"     onClick="removeAllLayers()"&gt;OFF&lt;/button&gt;
  &lt;button type="button" class="btn btn-link" onClick="addAllLayers()"&gt;ON&lt;/button&gt;
  &lt;/div&gt;
  </code></pre>
  
  <blockquote>
    <p>and add that control to the map like so:</p>
  </blockquote>
  
  <pre><code>map.legendControl.addLegend(document.getElementById('toggle').innerHTML).setPosition('topright');
  </code></pre>
  
  <blockquote>
    <p>and assign all layers to a layerGroup like so:</p>
  </blockquote>
  
  <pre><code>var showAllLayers = L.layerGroup(myData);
  var removeAllLayers = L.layerGroup(myData);
  </code></pre>
  
  <blockquote>
    <p>and build a function like so (only removeAllLayers example is shown):</p>
  </blockquote>
  
  <pre><code>function removeAllLayers() {
      removeAllLayers.clearLayers();
  };
  </code></pre>
  
  <p>Of course, this doesn't work. Can someone show me the way to get this figured out or do you have any better ideas on how to approach this? THANK YOU!</p>