jQuery, hover and multiple divs

Hello,

I have been trying to do some tooltips for a website and desperately wanted to learn something new and do that with jQuery.

However, every time a mouse hovers over a tooltip, all hidden divs are shown, not just the one that supposed to.

I know pretty much nothing about jQuery and cannot for love of God make the script to read proper div.

Any help would be greatly appreciated! :slight_smile:

Hereā€™s my html:


<div class="tip">
<a href="#"></a>
    <div class="tooltip">
        <p>test test test<p>
    </div>
</div>

And here is the script that I have:


$(document).ready(function()
{
    $("div.tip").hover(
      function () {
        $('div.tooltip').fadeIn('fast');
      },
      function () {
        $('div.tooltip').fadeOut('fast');
      }
    );
});

Thank you!
Regards,
Greg

Thanks, Baileylo, that didnā€™t work, however I have found the answer:

$(document).ready(function()
{
$(ā€œdiv.tipā€).hover(
function () {
$(ā€˜div.tooltipā€™, this).fadeIn(ā€˜fastā€™);
},
function () {
$(ā€˜div.tooltipā€™, this).fadeOut(ā€˜fastā€™);
}
);
});

:smiley:

thanks!
G.

$(ā€˜div.tooltipā€™).fadeIn(ā€˜fastā€™);

try

$(this).children(ā€˜div.tooltipā€™).fadein(ā€˜fastā€™);