Подсказка инструмента JQuery выбрала вложенный элемент Div для отображения проблемы

Question

У меня есть список информации около 30-50 строк, каждая из которых требует своей уникальной подсказки.Я знаю, что мог бы сделать все эти уникальные идентификаторы, но это было бы много потраченного впустую 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>

Я пробовал следующий скрипт, но он всегда возвращает первый <DIV> с классом "show_tooltip", который он находит, и повторяет его для каждой строки.Вот скрипт, который я пробовал:

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

Я использую следующий плагин подсказки: http://bassistance.de/jquery-plugins/jquery-plugin-tooltip/

РЕДАКТИРОВАТЬ:

Спасибодля ответа ниже.Мой получившийся код работал:

$(".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 .

Вышеприведенный jQuery (и связанная демонстрация) использует: hover(), stop(), fadeIn() и fadeOut() (только для справочных целей).