jQuery Tooltip not working with detach(), appendTo, etc?

Question

I'm trying to use this jQuery Tools ToolTip widget .

It works great in a situation like this:

    ...
<a id="A1">trigger</a> 
<script>
    $(document).ready(function () {
        $("#trigger").tooltip({ effect: 'slide' });
    });
</script>
    ...

But this will not work and it's what i want to do:

$("<a id='trigger'>trigger</a>").appendTo("body");
//console.log(myTrigger);

$("#trigger").tooltip({ effect: 'slide' });
$("#trigger").tooltip().show();

Can i dynamically add the trigger element so i can place the tooltip wherever i want? If so, how?

Answer 1

Sure. Theres a scripting api associated with the flowplayer plugins.

http://flowplayer.org/tools/documentation/scripting.html

This is the same for all of their plugins but the parameters will be different. Look 3/4's the way down the tooltip page for the parameters.

Answer 2

Works fine if i append it somewhere other than body such as a wrapper div:

$("<a id='trigger'>trigger</a>").appendTo($("#wrapper"));

$("#trigger").tooltip({ effect: 'slide' });
$("#trigger").tooltip().show();