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’);