Używanie przeciągnij i upuść za pomocą jQuery UI: zmiana przeciągniętego elementu podczas upuszczania

W przypadku korzystania z dragGables i droppables w jQuery UI, w jaki sposób zmienić przeciągany i upuszczany element przy upuszczaniu? Próbuję przeciągnąć jeden DIV do innego sortowalnego DIV. Po upuszczeniu chciałbym zmienić klasy na upuszczonym DIV i zmienić jego zawartość innerHTML.

Po przeczytaniu różnych pytań StackOverflow mój kod wygląda tak:

$(".column").droppable({
  accept: '.element-dragging', 
    drop: function(event, ui) {
        if ($(ui.draggable).hasClass("elemtxt")) {
            $(ui.draggable).replaceWith('<div class="element element-txt">This text box has been added!</div>');
        }
    }
})

To nie działa dla mnie. :-(

Pełna kopia mojego kodu znajduje się pod adresemhttp://www.marteki.com/jquery/bugkilling.php.

questionAnswers(1)

yourAnswerToTheQuestion