Leaflet easybutton state toggle doesn't work on mobile with onclick. Is there another way to do this?

Question

Currenty trying to toggle the visibility of a layer group of markers on the map using L.easybutton but on mobile devices, it just flickers and won't change. It does work as it should on a desktop browser though.

I'm guessing that phones don't work well with the onclick function, but I can't find another way of doing this.

const citytoggle = L.easyButton({
  states: [{
    icon: 'fa-undo',
    title: 'remove markers',
    stateName: 'remove-markers',
    onClick: function(control) {
      map.removeLayer(cityGroup)
      control.state('add-markers');
    }
  },
  {
    stateName: 'add-markers',
    icon: 'fa-map-marker',
    title: 'add city markers',
    onClick: function(control) {
      map.addLayer(cityGroup)
      control.state('remove-markers');
    }
  }]
});
citytoggle.addTo(map);

Any ideas?