Add some elements to a dropped item?

Question

Hi,

When I drop an item into a sortable list, can I modify its elements? I basically want to add a few buttons to the item when dropped, right now it's making a perfect clone of the source item. Example:

<ul id='listSource'>
   <li><p>Hello!</p></li>
</ul>

<ul id='listDestination'>
</ul>

so when one of the "li" items gets dropped into the destination list, it is a perfect copy like:

<li><p>Hello!</p></li>

I'd like to basically remove everything in the "li" item and reformat it to something like:

<li><img src='..'><button>delete</button></li>

I think we get the cloned object here:

$("#listDestination").sortable({
    stop: function(event, ui) {
        ui.item; // <- item is the new <li> element?
    }
}).disableSelection();

but how do I dynamically add all these dom elements to it?

Thank you