How to select an element by distance when it isn’t a parent or child

I’m working on editing a tooltip plugin (TooltipsY) to use a div instead of the title element for the content of the tooltip. I’m doing this for a multitude of reasons, the primary one being so I can have HTML in my tooltips without causing validation errors.

The problem I’m having is that when changed the content of the tooltip to be the div instead of the title attribute, every link with a tooltip shows the same tooltip content. That’s because The div’s aren’t related to the links in any way so I can’t use “this” to select them.

It would work if I knew some way to change $ ('div.showtip').html(); to this.closest($ ('div.showtip').html()); (that method won’t work because the div isn’t a parent or a child of the link) so how can I make the tooltip content the closest div to the link that’s being hovered over?

Here is my example: http://jsfiddle.net/sgCCD/

Note: The only thing that should need to be changed is the value of the variable showtip.

Also, I don’t want a suggestion for a different tooltip plugin, I’m doing this just as much for my own personal experience as I am to improve the functionality of the plugin.

newest questions tagged jquery – Stack Overflow

About Admin