How to change color of first vertex while drawing polygon using Leaflet.Draw?

Question

I am using Leaflet and Leaflet.Draw, and I am letting the user from my code to draw polygon (NOT using the Leaflet Draw Controls).

While the user is drawing the polygon I need to change the color of its first vertex, for example: green, so that user knows that he needs to click on the first point in order to close the polygon and finish drawing.

How can I change color of first vertex while drawing polygon using Leaflet.Draw?

The following image for elaboration, meaning it's fixed with a Paint Software.

P.S. Here is my code

var map = L.map('mapid',
            {
                minZoom: -1,
                maxZoom: 4,
                center: [0, 0],
                zoom: 1,
                crs: L.CRS.Simple
                });

var polygonDrawer = new L.Draw.Polygon(map);

map.on('draw:created', function (e) {
var type = e.layerType, layer = e.layer;
 layer.editing.enable();
  layer.addTo(map);

  });

$(document)ready(function(){
polygonDrawer.enable();
});

Answer 1

While I was hacking with the Leaflet.Draw and on the creation of polygon I have come up with the following code:

    map.on('draw:drawvertex',
        function (e) {
            $(".leaflet-marker-icon.leaflet-div-icon.leaflet-editing-icon.leaflet-touch-icon.leaflet-zoom-animated.leaflet-interactive:first").css({ 'background-color': 'green' });
        });

So, there is a listener you can insert it in your code, draw:drawvertex which means whenever a vertex created I need to do something.

Then, using jQuery you're selecting the first element from this long selector, and set its background color to green or any other color.