Question

I have a problem where I need to change the html of a draggable helper element on drop, as below? any suggestions?

        <ul id="submenu">
            <li><div class="thumb"></div></li>
            <li><div class="thumb"></div></li>                                  
        </ul>

        <ul id="sortable">
            <li></li>
        </ul>

        --------------
        --------------

    // #### DRAGGABLE ####
$(".thumb").draggable({
    helper: "clone",
    appendTo: 'body',
    connectToSortable: "ul#sortable",
    revert: "invalid",
    stop: function(event,ui) {

        -- -------------------------------- --
        -- Change html of ui.helper here ?? --
        -- -------------------------------- --

    }
});

Answer 1

you can’t set a ondrop event for draggable element. you should do it in droppable side.

$("#drop").droppable({
    drop : function(event,ui) {
         //do what you want with ui.helper
    }
});