ajax - Ajax でコンテンツをロードすると、JQuery UI タブが正しくレンダリングされない

Question

JQuery タブの次の html コンテンツがあります。

<div id=tabs >
    <ul>
        <li><a href=#tab1>Tab 1</a></li>
        <li><a href=#tab2>Tab 2</a></li>
    </ul>
    <div id=tab1>Content of Tab1</div>
    <div id=tab2>Content of Tab2</div>
</div>

そして、js で次の関数を呼び出してタブをレンダリングします。

function checkerTabs_jqueryui_init(){
    $( "#tabs" ).tabs().addClass( "ui-tabs-vertical ui-helper-clearfix" );
    $( "#tabs li" ).removeClass( "ui-corner-top" ).addClass( "ui-corner-left" );
}

最初の jsp ページ (ajax ではない) に直接コンテンツを配置する限り、すべてがうまく機能します。しかし、ajax呼び出しを介してコンテンツをページにロードすると:

$( "#tabs" ).load(
        'fetchTabs', null, checkerTabs_jqueryui_init
    );

tabs() 関数が適用されていないリストのように、コンテンツをタブとしてレンダリングしません。ajax呼び出しはまったく同じhtmlコンテンツを返し、コールバック関数は確実に呼び出されますが、正しくレンダリングされない理由がわかりません. 何か不足していますか？