title: move checkbox form one group to other
body: <p>i want to do a simple work search alot but culd not be done by me, if i checked a checkbox in <strong>undone</strong> it moves to the <strong>Done</strong> group and if i check a second checkbox it also moves to the <strong>done</strong> group and if i checked a checked box in <strong>Done</strong> it moves back to the <strong>Undone</strong> i have done this in jquery but want to do this in javascrip<br>
  <em>can any one help me</em></p>
  
  <pre><code>&lt;table width="427" height="88"&gt;
  &lt;tr&gt;&lt;td&gt;&lt;input type="button" name="submit" value="Add New" /&gt;&lt;/td&gt;&lt;/tr&gt;
  &lt;tr&gt;
  &lt;td id="1"&gt;Undone&lt;br /&gt;
  &lt;input type="checkbox" name="chk1" id="chk1" onclick="remove(this.id);" /&gt;
  &lt;input type="checkbox" name="chk2" id="chk2" onclick="remove(this.id);"/&gt;
  &lt;input type="checkbox" name="chk3" id="chk3" onclick="remove(this.id);"/&gt;&lt;/td&gt;
  &lt;/tr&gt;
  &lt;tr&gt;
  &lt;td id="2"&gt;Done&lt;br /&gt;
  &lt;input type="checkbox" name="chk4" id="chk4" onclick="remove2(this.id)"/&gt;
  &lt;input type="checkbox" name="chk5" id="chk5" onclick="remove2(this.id)"/&gt;
  &lt;input type="checkbox" name="chk6" id="chk6" onclick="remove2(this.id)"/&gt;
  &lt;/td&gt;
  &lt;/tr&gt;
  &lt;/table&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  &lt;script&gt;
  function remove(id){
   $("#"+id).remove();
   var chk='&lt;input type="checkbox" name='+id+' id='+id+' onclick="remove2(this.id)"/&gt;';
   $("#2").append(chk);
  
   };
   function remove2(id){
   $("#"+id).remove();
   var chk='&lt;input type="checkbox"  name='+id+' id='+id+' onclick="remove(this.id)"/&gt;';
   $("#1").append(chk);
  
   };
   &lt;/script&gt;
  </code></pre>