title: Jquery - copy a row from one table to another
body: <p>I'm brand new to jquery and javascript and I'm trying to write a simple app that will, when I press a button, copy a row from one table to another and then delete the row from the first table.  I have a DeleteRow function that works just fine, but I can't get my <strong>"DraftPlayer"</strong> function to copy the row. I've tried quite a few of the solutions I've found on the web, but I can't get the syntax just right. You'll see only the second row in the table has the DraftPlayer button as I work this out.  </p>
  
  <p>Here are the code snippets I think are critical:</p>
  
  <pre><code>&lt;!doctype html&gt;
  &lt;html&gt;
  &lt;head&gt;
  &lt;meta charset="utf-8"&gt;
  &lt;title&gt;Untitled Document&lt;/title&gt;
  //&lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"&gt;&lt;/script&gt;
  &lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"&gt;&lt;/script&gt;
  &lt;/head&gt;
  
  &lt;body&gt;
  &lt;div&gt;&amp;nbsp;&lt;/div&gt;
  &lt;p&gt;Welcome to Mike's Draft App! &lt;/p&gt;
  &lt;table id="players"&gt;
  &lt;table border="1"&gt;
    &lt;tr&gt;
      &lt;td width="36"&gt; Rank &lt;/td&gt;
      &lt;td width="141"&gt; Player Name &lt;/td&gt;
      &lt;td width="52"&gt;Position &lt;/td&gt;
      &lt;td width="38"&gt;Team &lt;/td&gt;
      &lt;td width="69"&gt; Bye Week &lt;/td&gt;
      &lt;td width="52"&gt;&lt;input type="button" value="Delete" onClick="DeleteRow(this)"&gt;&lt;/td&gt;
    &lt;/tr&gt;
    &lt;tr&gt;
      &lt;td&gt;1&lt;/td&gt;
      &lt;td&gt;Antonio Brown&lt;/td&gt;
      &lt;td&gt;WR&lt;/td&gt;
      &lt;td&gt;PIT&lt;/td&gt;
      &lt;td&gt;8&lt;/td&gt;
      &lt;td&gt;&lt;input type="button" value="Delete" onClick="DeleteRow(this)"&gt;&lt;/td&gt;
      &lt;td width="103"&gt;&amp;nbsp;&lt;/td&gt;
    &lt;/tr&gt;
    &lt;tr&gt;
      &lt;td&gt;2&lt;/td&gt;
      &lt;td&gt;Julio Jones&lt;/td&gt;
      &lt;td&gt;WR&lt;/td&gt;
      &lt;td&gt;ATL&lt;/td&gt;
      &lt;td&gt;11&lt;/td&gt;
      &lt;td&gt;&lt;input type="button" value="Delete" onClick="DeleteRow(this)"&gt;&lt;/td&gt;
      &lt;td&gt;&lt;input type="button" value="Draft" onClick="DraftPlayer(this)"&gt;&lt;/td&gt;
    &lt;/tr&gt;
  
  &lt;table id="drafted"&gt;
  &lt;table border="1"&gt;
    &lt;tr&gt;
      &lt;td width="36"&gt; Rank &lt;/td&gt;
      &lt;td width="141"&gt; Player Name &lt;/td&gt;
      &lt;td width="52"&gt;Position &lt;/td&gt;
      &lt;td width="38"&gt;Team &lt;/td&gt;
      &lt;td width="69"&gt; Bye Week &lt;/td&gt;
    &lt;/tr&gt;
    &lt;/table&gt;
  
  
  &lt;script&gt;
      function DeleteRow(o) {
       var p=o.parentNode.parentNode;
           p.parentNode.removeChild(p);
      }
  
      function DraftPlayer(o) {
       var p=o.parentNode.parentNode;
  
      copyTable = $('#drafted tbody');
      cloneRow = p.clone();
      copyTable.append(cloneRow);
  
      p.parentNode.removeChild(p);     
  
      }
  &lt;/script&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>Thanks for any suggestions!</p>