Creating complex DIV for a prependTo

Creating complex DIV for a prependTo

I’m working with a row of buttons that were created on the fly by the TinyMCE editor. A lot of these buttons are custom buttons that I created so I’m trying to  add a blue dot on the button that can be clicked to bring up an explanation, as below.


The problem is that the explanation box is positioned relative to the canvas, not the button. The TinyMCE toolbar will appear on top of whatever box opens it, and the boxes can be anywhere on the screen when the editor is called up.  To get the explanation to be close to the button clicked I think I need to create the explanation box in jQuery an do a prependTo to the button ID, something like 


  1. $('<div [with ul, li, etc] </div>. attr({''id' : "mlinc_tip}
  2.                                          .addClass('bd_tip'')
  3.                                          .prependTo(#mlinc');


#mlinc is the id of the button. 


The HTML I have now for this explanation box is:

  1. <div id="mlinc_tip" class="blueQ_tip">
  2.    <img class="blue_tip_close" src="images/close_X.jpg" >
  3.    <ul>
  4.       <li>Increase the left margin of all the paragraphs in this box.</li>
  5.    </ul>
  6. </div>
How can I create this DIV in the jQuery that ends with the prependTo ?

Thanks for any help.