How to set placeholder when drag an item to other container?

How to set placeholder when drag an item to other container?


I have a table, and a list. I want to drag the table header into the ol list. But when the header items are being dragged to the ol list, the placeholder became a dot. I am using JQuery UI Sortable and connectWith option. Here is the code:

jsfiddle.net/2d5tu9jb







Thanks.

[Update]
Thanks kbwood.au, IE 11 and Chrome works fine. But Firefox doesn't.