QTip2 Multiple Elements, Same Tooltip

Question

I have a page in which I dynamically create elements that need tooltips.

I've tried a few different approaches and looked online for some answers to no avail.

As of now, I have this:

var $links = $('a.link');
var len = $links.length;
for(var i = 0; i < len; i++){
    var $ele = $($links[i]);
    $ele.qtip({
        id: 'editLink',
        overwrite: false,
        content: {
            text: $linkEditor,
            title: {
                text: 'Edit Link',
                button: true
            }
        },
        position: {
            my: 'top center',
            at: 'bottom center',
            viewport: $(window)
        },
        show: {
            event: 'mouseover',
            solo: true
        },
        hide: false,
        style: {classes: 'ui-tooltip-shadow ui-tooltip-red'}
    });
}

What I'm looking for is some way to have all of these elements use the exact same tooltip. I want them all to use the exact same content (in this case a single form) and reference the tooltip in the exact same way (by the tooltip element with id 'ui-tooltip-editLink').

With what I have, it currently creates the first tooltip correctly, but if I add a new element and reassign tooltips, it creates a whole new tooltip with a different id for the new element.

Does anyone know some way of accomplishing a multiple elements, same tooltip approach?

Answer 1

I've figured out how to have one tooltip div be shared by many tooltip images if anyone finds it handy

 $(".tooltipBearing").qtip({
                            content: {  
                                text: $("#tooltipDiv").html()
                            }          
                      });

If you fail to put the .html() on there, you will see the shared tooltip show up once, and then when you activate it from another image, it will no longer work for the first one...

The tooltipBearing is a class set on some images in the page.

tooltipDiv is the ID of the div containing your tooltip content.