add element before some element

Question

I have this code:

<td>
    <div id="vB_Editor_QR_cmd_email" class="imagebutton">
      abc
    </div>
</td>

I want put another element to this code like this:

<p>blablablalblablab</p>
 <td>
    <div id="vB_Editor_QR_cmd_email" class="imagebutton">
       abc
     </div>
 </td>

I use this code

 $("#vB_Editor_QR_cmd_insertimage").before("<p>blablablalblablab</p>");

but it only put before div tag.

 <td>
    <p>blablablalblablab</p>
    <div id="vB_Editor_QR_cmd_email" class="imagebutton">
       abc
     </div>
 </td>

I want it like this

 <p>blablablalblablab</p>
     <td>
        <div id="vB_Editor_QR_cmd_email" class="imagebutton">
           abc
         </div>
     </td>

Answer 1

Try this,

$("#vB_Editor_QR_cmd_insertimage").parents("td:first").before("<p>blablablalblablab</p>");

parents("td:first") will return first parent of div

hope this help.....

Answer 2

Use before or insertBefore to place an element before another.

$("<p>blablablalblablab</p>").insertBefore("td");

or

$("td").insertBefore("<p>blablablalblablab</p>");

or more specifical to your html:

$("vB_Editor_QR_cmd_email").parent("td").before(...);

Though unless this is just a (bad) example, this is invalid. You can't have a <p> tag directly before a <td> because that would imply that the <p> is within a <tr>.