How do I change the default cursor in leaflet maps?

Question

I am trying to modify the default cursor icon when a certain control button is pressed. Although I was partially successful by using css on the container div, doing this ove

Answer 1

This is what worked for me:

// CSS first. Add this to leaflet stylesheet.
.leaflet-interactive.wait-cursor-enabled {
    cursor: wait !important;
}

// JS select from map container and add class to each element
let map = L.map('map');
let els = map.getContainer().querySelectorAll('.leaflet-interactive');
for(let el of els){
   el.classList += ' wait-cursor-enabled'; 
}

//JS remove class once no longer needed
let els = map.getContainer().querySelectorAll('.leaflet-interactive.wait-cursor-enabled');
for(let el of els){
   el.classList.remove("wait-cursor-enabled");
}