jquery - jQueryUI アコーディオンに追加

Question

1.10 のドキュメントによると、ドロップ時にアコーディオンにアイテムを追加するための次のコード ( jsFiddleにもあります) が機能するはずです。

$( "#accordion" ).accordion();

$( "#accordionContainer" ).droppable({
    drop: function( event, ui ) {
        $( "<h3>New Item</h3>" ).appendTo( "#accordion" );
        $( "<div>New Description</div>" ).appendTo( "#accordion" );
        $( "#accordion" ).accordion( "refresh" );
    }
});

そうではありません。追加したい場所を明示的に指定しても、追加された h3 と div が間違ったオブジェクトに追加されます。

動作中の機能を示すドキュメントに付随する jsFiddle の例がありますが、初心者が違いを理解するには長すぎて複雑すぎます。私は単純な間違いを犯しているに違いありません。右？それは何ですか？

アコーディオンをアコーディオンとドロップ可能の両方にする方法はありませんか? 次に、追加のターゲットとして適切な「これ」を指定するにはどうすればよいですか?

前もって感謝します。