JQueryツールヒント表示のためにネストされたDivを選択問題

Question

私はそれぞれ独自のツールチップを必要とする30-50行の情報リストを持っています。私はこれらのすべてのユニークなIDを作ることができることを知っているが、それは無駄なjavascriptの多くになります。私はjqueryを入れて、<DIV>の中の "show_tooltip"クラスのツールチップを<DIV>の "tool_tip"のクラスで返すようにしています。すべてのツールのヒントは一意になります。

<DIV class="tool_tip"> 
<DIV>Content here</DIV> 
<DIV style="display:none;" class="show_tooltip">Any tool tip information goes here with possible html</DIV> 
</DIV> 

<DIV class="tool_tip"> 
<DIV>Content here</DIV> 
<DIV style="display:none;" class="show_tooltip">Another but different tool tip to be displayed</DIV> 
</DIV> 

私は次のスクリプトを試してみましたが、それは常に、それが見つけて、行ごとに繰り返されることを「show_tooltip」のクラスで最初<DIV>を返します。私は、以下のツールチッププラグインを使用しています

$(".tool_tip").tooltip({ 
bodyHandler: function() { 
    return $("div.tool_tip").children(".show_tooltip").html(); 
}, 
showURL: false 
}); 

：ここに私がしようとしたスクリプトですhttp://bassistance.de/jquery-plugins/jquery-plugin-tooltip/

EDIT：以下の答えのための

が

感謝。働いていた私の結果のコードはでした：

$(".tool_tip").tooltip({ 
bodyHandler: function() { 
    return $(this).find('.tooltip_content').stop().html(); 
}, 
showURL: false 
}); 

Answer 1

これは、比較的容易である、または次のようになります。

$('.tool_tip').hover(
    function(){ 
     $(this).find('.show_tooltip').stop().fadeIn(500); 
    }, 
    function(){ 
     $(this).find('.show_tooltip').stop().fadeOut(500); 
    }); 

JS Fiddle demo。

ザjQueryの（及び連結デモ）上記の使用：hover()、stop()、fadeIn()とfadeOut()を（単に参照の目的のために）。