JQuery Tool Tip Cliché imbriqué sélectionné pour l'affichage Problème

Question

J'ai une liste d'informations de 30 à 50 lignes chacune nécessitant leur propre info-bulle. Je sais que je pourrais faire tous ces identifiants uniques, mais ce serait beaucoup de javascript gaspillé. J'essaie d'avoir jquery retourner l'infobulle du <DIV> imbriqué avec la classe de "show_tooltip" à l'intérieur de avec la classe de "tool_tip". Toutes les astuces d'outils seront uniques.

<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> 

J'ai essayé le script suivant, mais il retourne toujours la première <DIV> avec une classe de « show_tooltip » il trouve et répète que pour chaque ligne. Voici le script que j'ai essayé:

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

J'utilise le plugin infobulle suivant: http://bassistance.de/jquery-plugins/jquery-plugin-tooltip/

EDIT:

Merci pour la réponse ci-dessous. Mon code résultant qui a travaillé était:

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

Answer 1

Ceci est, ou devrait être, relativement facile:

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

JS Fiddle demo.

ci-dessus jQuery (et la démo reliée) utilise: hover(), stop(), fadeIn() et fadeOut() (juste à titre de référence).