title: Mapboxgl JS doesn't remove markers
body: <p>I am trying to remove my markers in a MapboxGL map following this <a href="https://stackoverflow.com/questions/46155523/mapbox-clear-all-current-markers/46170879#46170879">question</a> but It doesn't work, it throws: </p>
  
  <pre><code>var marker = new mapboxgl.Marker().addTo(map);
  marker.remove();
  TypeError: e is undefined
  </code></pre>
  
  <p>My workflow is to throw a javascript function to remove markers and add new  markers,: </p>
  
  <blockquote>
  <pre><code>            geojson.features = new_features;
              /* here code to remove!! */
              HERE CODE TO REMOVE!
              /* add markers to map */
  
              geojson.features.forEach(function(marker) {
                // create a HTML element for each feature
                var el = document.createElement('div');
                el.className = 'marker';
  
                // make a marker for each feature and add it to the map
                var new_marker = new mapboxgl.Marker(el)
                    .setLngLat(marker.geometry.coordinates)
                    .setPopup(new mapboxgl.Popup({offset: 25}) // add popups
                        .setHTML('&lt;h3&gt;' + marker.properties.title + '&lt;/h3&gt;&lt;p&gt;' + marker.properties.description + '&lt;/p&gt;'))
                    .addTo(map);
              });
  </code></pre>
    
    <p>In my last effort I tried this to remove with this but It doesn't work well (The workflow updates randomly  markers):</p>
  
  <pre><code>            /* remove markers */
              var markers = document.getElementsByClassName('marker');
              for (i = 0; i &lt; markers.length; i++) {
                  var marker = markers[i];                    
                  marker.remove();
              }
  </code></pre>
  </blockquote>
  
  <p><strong>UPDATE</strong></p>
  
  <p>I tried the suggested solution, but It doesn't work....: </p>
  
  <pre><code>        let markers = [];
          geojson.features.forEach((feature) =&gt; {
            let marker = new mapboxgl.Marker().setLngLat(feature.geometry.coordinates).addTo(map);
            markers.push(marker);
          });
  
          // clear markers array
          markers.forEach((marker) =&gt; marker.remove())
  
  
          geojson.features = features;
  
          geojson.features.forEach(function(marker) {
            // create a HTML element for each feature
            var el = document.createElement('div');
            el.className = 'marker';
            //el.setAttribute("longitude",marker.geometry.coordinates[0].toString());
            //el.setAttribute("latitude",marker.geometry.coordinates[1].toString());
  
            // make a marker for each feature and add it to the map
            var new_marker = new mapboxgl.Marker(el)
                .setLngLat(marker.geometry.coordinates)
                .setPopup(new mapboxgl.Popup({offset: 25}) // add popups
                    .setHTML('&lt;h3&gt;' + marker.properties.title + '&lt;/h3&gt;&lt;p&gt;' + marker.properties.description + '&lt;/p&gt;'))
                .addTo(map);
          });
  </code></pre>