title: How to add popup on waypoints markers including start and end using leaflet routing machine?
body: <p>I am trying to put the popup when you click on the waypoint or even from start and end points on the route. So in simple words if you have point A, B and C and I need popup on all those A, B and c Markers.</p>
  
  <p>I have tried this but so far I have manage on only one marker and not the all so let me know how we can do this.......</p>
  
  <p>Here is my code:</p>
  
  <pre><code>    &lt;script src="http://cdn.leafletjs.com/leaflet/v0.7.7/leaflet.js"&gt;&lt;/script&gt;
  &lt;script src="&lt;?php echo PLUGINS_DIR;?&gt;leaflet_routing_machine/dist/leaflet-routing-machine.js"&gt;&lt;/script&gt;
  &lt;script src="&lt;?php echo PLUGINS_DIR;?&gt;leaflet_control_geocoder/Control.Geocoder.js"&gt;&lt;/script&gt;
  
      &lt;script&gt;
  
      var map = L.map('mapid').setView([-36.85625, 174.76141], 5);
  
  L.tileLayer('http://{s}.basemaps.cartocdn.com/light_all//{z}/{x}/{y}.png', {
      attribution: '&amp;copy; &lt;a href="http://www.openstreetmap.org/copyright"&gt;OpenStreetMap&lt;/a&gt; &amp;copy; &lt;a href="http://cartodb.com/attributions"&gt;CartoDB&lt;/a&gt;',
  
      id: 'mapbox.streets'
  }).addTo(map);
  
  var geocoder = L.Control.Geocoder.nominatim(),
      routeControl = L.Routing.control({
      geocoder: geocoder,
    routeWhileDragging: false,
  }).addTo(map),
      waypoints = [];
  
  geocoder.geocode('94 Dominion Road, Mount Eden Auckland', function(a, b) {
      // depending on geocoder results may be either in a or b 
     // console.log(a);
      // choose the best result here. probably the first one in array
      var point = a[0];
      // create waypoint object
      var wpt = L.Routing.waypoint(L.latLng(point.center.lat, point.center.lng), point.name)
      waypoints.push(wpt);
    routeControl.setWaypoints(waypoints);
  
    var marker_first = L.marker([point.center.lat, point.center.lng], {
        draggable: false
      }).addTo(map);
      marker_first.bindPopup('&lt;strong&gt;Journey Start:&lt;/strong&gt;94 Dominion Road, Mount Eden Auckland');
  })
  
  geocoder.geocode('5 Flower Street, Eden Terrace, Auckland', function(a, b) {
      // depending on geocoder results may be either in a or b 
      //console.log(a);
      // choose the best result here. probably the first one in array
      var point = a[0];
      // create waypoint object
      var wpt = L.Routing.waypoint(L.latLng(point.center.lat, point.center.lng), point.name)
      waypoints.push(wpt);
  
    routeControl.setWaypoints(waypoints);
    var marker_second = L.marker([point.center.lat, point.center.lng], {
        draggable: false
      }).addTo(map);
      marker_second.bindPopup('&lt;strong&gt;Waypoint:&lt;/strong&gt;5 Flower Street, Eden Terrace, Auckland');
  /*  var popup = L.popup()
     .setLatLng(L.latLng(point.center.lat, point.center.lng))
      .setContent('&lt;p&gt;Hello world!&lt;br /&gt;This is a nice popup.&lt;/p&gt;')
      .addTo(map);*/
  }) 
  
  
  geocoder.geocode('280 Queen Street, Auckland 1010', function(a, b) {
      // depending on geocoder results may be either in a or b 
      //console.log(a);
      // choose the best result here. probably the first one in array
      var point = a[0];
      // create waypoint object
      var wpt = L.Routing.waypoint(L.latLng(point.center.lat, point.center.lng), point.name)
      waypoints.push(wpt);
    routeControl.setWaypoints(waypoints);
    var marker_third = L.marker([point.center.lat, point.center.lng], {
        draggable: false
      }).addTo(map);
      marker_third.bindPopup('&lt;strong&gt;End Journey:&lt;/strong&gt;280 Queen Street, Auckland 1010');
  
  })
  //.on('click', function(e) { console.log("hello"); });
      &lt;/script&gt;
  </code></pre>
  
  <p>Any running code on fiddle would be very helpful but if you can edit my code and make it work even that's help me a lot. Thank you so much in advanced. </p>