Question

I want to add new element by jquery with old element and also remove old element in place of new.

For ex,

<div id="a1"> </div>

should be like

<table border="0" cellpadding="0" cellspacing="0">
      <tr>
       <td class="Frame_Box_top_left"></td>
       <td class="Frame_Box_top"></td>
       <td class="Frame_Box_top_right"></td>
      </tr>
      <tr>
       <td class="Frame_Box_left"></td>       
       <td class="Frame_Box_inner" valign="top">

                  "new element here !"

       </td>
       <td class="Frame_Box_right"></td>
      </tr>
      <tr>
       <td class="Frame_Box_bottom_left"></td>
       <td class="Frame_Box_bottom"></td>
       <td class="Frame_Box_bottom_right"></td>
      </tr>
</table>

Answer 1

You can use .wrap() to put a new element around an old one, like this:

$("#a1").wrap('<div id="new" />');

For other cases not working with a single element, there’s also .wrapAll(), and for wrapping contents instead of the element itself, there’s .wrapInner().