Usando o arrastar e soltar na UI do jQuery: alterando o elemento arrastado na queda

Ao usar draggables e droppables da jQuery UI, como você altera o elemento arrastado e solto na queda? Eu estou tentando arrastar um DIV para outro DIV sortable. Por outro lado, gostaria de alterar as classes no DIV descartado e alterar seu conteúdo innerHTML.

Depois de ler várias questões do StackOverflow, meu código se parece com isto:

$(".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>');
        }
    }
})

Não está funcionando para mim. :-(

Uma cópia completa do meu código está localizada emhttp://www.marteki.com/jquery/bugkilling.php.

questionAnswers(1)

yourAnswerToTheQuestion