jquery ui get exact dropped element

Question

How to get the exact dropped elelement with jquery ui droppable

I have 2 or more elements overlay.

And when I drop an element jquery ui run the "drop" event for each element no juste the element I've drop.

Answer 1

Ok I found this solution

I add the hovered class and when is dropped I check if my element has this class

    $(".droppable").hover(
        function () {
            $(this).addClass('hovered')
        }, function () {
            $(this).removeClass('hovered')
        },
    );

    $('.droppable').droppable({
        refreshPositions: true,
        greedy: true,
        tolerance: "touch",
        drop: function (event, ui) {
            var draggedElement = ui.draggable;
            var droppedElement = $(this);
            if(droppedElement.hasClass('hovered')) {
                console.log('droppable')
                // drop my element
            }

        },
    });