Draggable Table Rows (working)

HTML

<link rel="stylesheet" href="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.4/themes/smoothness/jquery-ui.css">
<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.4/jquery-ui.min.js"></script>
<table>
  <thead>
    <th>Stolpec 1</th>
    <th>Stolpec 2</th>
    <th>Stolpec 3</th>
  </thead>
  <tbody>
    <tr>
      <td>
        <input value="drag 1" class="dragItem" readonly>
      </td>
      <td>
        <input id="inputChk" type="checkbox">
      </td>
      <td>test2</td>
      <td id="td3">test XX</td>
    </tr>
    <tr>
      <td>
        <input>
      </td>
      <td>
        <input id="inputChk" type="checkbox">
      </td>
      <td>test3</td>
      <td id="td3">test YY</td>
    </tr>
    <tr>
      <td>
        <input value="drag 3" class="dragItem" readonly>
      </td>
      <td>
        <input id="inputChk" type="checkbox">
      </td>
      <td>test4</td>
      <td id="td3">test ZZ</td>
    </tr>
    <tr>
      <td>
        <input value="drag 4" class="dragItem" readonly>
      </td>
      <td>
        <input id="inputChk" type="checkbox">
      </td>
      <td>test5</td>
      <td id="td3">test BB</td>
    </tr>
    


    <tbody>

CSS

table {
  /* border-collapse: collapse; */
}

table tr td, table tr th {
  border: 1px solid red;
  padding: 2px 15px 2px 15px;
  width: 50px;
}

#tabs ul li.drophover {
  color: green;
}


}

JavaScript

$("tbody").sortable({
  items: "> tr",
  appendTo: "parent",
  helper: "clone"
}).disableSelection();