Jquery copy and paste DOM node?

I have a table that looks like the following.

<tr>
  <td>Link Name</td>
  <td><a href="#" class="edit">Edit</a></td>
</tr>

At the bottom of t开发者_如何学编程he table I have the following.

<tr>
  <form class="hidden create">
    <h3>Add Link</h3>
    ...
    <input type="hidden" name="form_id" value="{menu-id}" />
  </form>
</tr>

To avoid a massive page of HTML I thought it would be cool if jquery could copy the create form, tweak a few attributes then make it appear after the links row. The only query really is how..

So here are my questions.

1) How do I grab the create form and save it as variable with jquery?

2) How do I edit the hidden field? I know how to change attributes but how do I select the field it once the form is within a variable?

3) How do I paste this form into my table after the edit link on its own row? I need something like parent-parent-after?

Thanks loads

1) Place a copy of the form in a variable:

var create_form = $('form.create').clone();

2) Get the hidden input from the variable:

create_form.find(':hidden[name=form_id]').doSomething()...

3) Place form after .edit link in the same row (I assume this is in an event handler):

$(this).closest('tr').find('a.edit').after( create_form );

var form = $('#your-form').clone();

This creates a copy of the selected elements. The original is not manipulated if you use the form-variable now.

Editing hidden fields works exactly like manipulating other DOM-elements:

form.attr('action', 'some-new-action');

You can "paste" your form using several methods. Possible solutions would be:

form.appendTo('#some-parent');
form.after('#some-parent');

visit http://api.jquery.com/clone/ for detailed explanation.

This is the quick preview

HTML

<div class="container">
  <div class="hello">Hello</div>
  <div class="goodbye">Goodbye</div>
</div>

Javascript

$('.hello').clone().appendTo('.goodbye');

Output

<div class="container">
  <div class="hello">Hello</div>
  <div class="goodbye">
    Goodbye
    <div class="hello">Hello</div>
  </div>
</div>

Hope it helps..