map.clearLayers preventing 'click' event in Leaflet

[Mihailo Arnaut]

This is supposed to be a route chooser for alternative routes. You click on the route and it selects itself.

For couple of days I am trying to get out of "enchanted circle" :), because after days and days of debugging I have found out that map.clearLayers() method is somehow block the "click" event.

Here's the situation: When you click on one of the routes, you get, in this case, alert "Layer clicked". But when you click another route, or even the same route again, the "click" is not working.

All other events, like doubleclick, mouseout, mousein, etc. are working but click don't... Also mouseup, mousedown don't work either, which could probably solve this issue, but - nothing :(

            var $li = $(li);
            route.idx = i;
            $li.data('route', route);
            $li.data('routes', routes);
            $li.on('click', function () {
                var $this = $(this);
                $this.siblings('li').removeClass('active');
                $this.addClass('active');
                renderCarOrWalkRoute($this.data('routes'), $this.data('route').idx);
            });
            $alternatives.find('.routes').append($li);
        }

        for (var i = 0; i <= route.idx; i++) {
            alternativeRoute[i] = renderAlternativeRoute($li.data('routes'), i);
        }

        $($alternatives.find('li')[0]).trigger('click');
        UI.resetScrollPosition();

        alternativeRoute[0].on('click',function (e) {
            UI.alert("Layer clicked!");
        });

In method renderCarOrWalkRoute, there is map.clearLayers(), but if I comment that, routes won't be cleared while selecting the other route.

Has anyone ever encountered that "click" is blocked in any way via Leaflet?

Thanks!