title: Trigger an event on single markers in leaflet LayerGroup
body: <p>Hi everyone (or should I say "anyone [who would read this...]?) :)</p>
  
  <p>I have tried to find the answer for two days but without success (most likely because I am a brand new user). I have on a leaflet map markers organized in a Layergroup so I can manage them with Layercontrol. I would like that when a marker is clicked it triggers an event (in my case the creation of a circle representing a specific distance around this marker). I would like to manage that outside of the individual markers because I want also to set some different options for the radius of the circle according to the distance selected by the user.</p>
  
  <p>Below are different pieces of code showing what I mean :</p>
  
  <pre><code>&lt;!DOCTYPE html&gt; 
  &lt;head&gt; 
  &lt;title&gt;Example&lt;/title&gt; 
  &lt;meta http-equiv="Content-Type" content="text/html; charset=utf-8" /&gt; 
  &lt;script src="https://unpkg.com/leaflet@1.0.2/dist/leaflet.js"&gt;&lt;/script&gt;
  &lt;link rel="stylesheet" href="https://unpkg.com/leaflet@1.0.2/dist/leaflet.css"/&gt;
  &lt;style&gt;
  
  body {
      font-family: Helvetica;
      margin:0;
  }
  
  #map{
      position:absolute;
      top:0;
      bottom:0;
      width:100%;}
  
  &lt;/style&gt;
  &lt;/head&gt;
  
  &lt;body&gt;
  &lt;div id="map"&gt;&lt;/div&gt;
  &lt;script&gt;
  
  var sites = [
          {'loc':[42.2793869135936,9.53257201027757],'title':'TORRA A I CASELLI'},
          {'loc':[42.2713622720985,9.50678498185463],'title':'TOUR GIANDINELLI'},
          {'loc':[42.641518105666,9.00587322013212],'title':'TOUR DE LOSARI'},];
  
  var map = new L.Map('map');
  map.addLayer(new L.TileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png'));
  map.setView([42.5,9.2210706018535],9);
  
  var marks = new L.LayerGroup();
      for(i in sites) {
          var title = sites[i].title,
              loc = sites[i].loc,
              markersites = new L.Marker(new L.latLng(loc), {title: title});
          markersites.bindPopup('&lt;strong&gt;'+title+'&lt;/strong&gt;&lt;br&gt;');
          marks.addLayer(markersites);
      }
  marks.addTo(map);
  
  // for now it is all good, the next part is where I fail
  
  marks.on('click',function(){
      console.log("Yeah!");
      new L.circle(this.getLatLng(), 10000, {color:'red', fillOpacity:0.3}).addTo(map)});
  
  &lt;/script&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>Any help would be much appreciated, thank you for your attention.</p>
  
  <p>Cheers,
  Guillaume.</p>