jQuery UI is not preserving original opacity of sortable element when dropped in a different tab

I am using the jQuery UI sortable feature with a connected list through tabs. The jQuery code that initializes this is as follows:

$( "#sortable1, #sortable2, #sortable3, #sortable4, #sortable5, #sortable6, #sortable7, #sortable8, #sortable9, #sortable10" ).
    sortable({ 
        placeholder: 'sortable-placeholder', 
        forcePlaceholderSize: true, 
        opacity: 0.7
});

$('.tabs').tabs();
var $tabs = $( ".tabs" ).tabs('paging', { follow: true, followOnSelect: true, tabsPerPage: 5});

var $tab_items = $( "ul:first li", $tabs ).droppable({
    tolerance: "pointer",
    accept: ".connectedSortable li",
    hoverClass: "ui-state-hover",
    drop: function( event, ui ) {
        var $item = $( this );
        var $list = $( $item.find( "a" ).attr( "href" ) )
            .find( ".connectedSortable" );

        ui.draggable.hide( "fast", function() {
            $tabs.tabs( "select", $tab_items.index( $item.prev() ) );
            $( this ).appendTo( $list ).show( "fast" );
        });
    }
});

The sorting, drag and dropping works beautifully. The issue is with the opacity. When I sort on the same tab, the original element comes back (I am assuming the helper is eliminated). BUT when I drag the list item to another tab, the opacity remains (I am assuming the he开发者_运维技巧lper is element that is dropped in this case). Can someone point me in the right direction?

Any comments or suggestions would be greatly appreciated.

Thanks!

I figured it out. The opacity can simply be changed back via .css(). I could have sworn I tried this before and it didn't work but it did!

$( this ).appendTo( $list ).show().css({'opacity':'1'});