variable vs. object jquery

by Ian Roberts

HTML

<div id="topNav">
<table>
<tbody>
  <tr>
    <td id="item1">1</td>
    <td id="item2">2</td>
    <td id="item3">3</td>
    <td id="item4">4</td>
    <td id="item5">5</td>
    <td id="item6">6</td>
  </tr>
</tbody>
</table>
</div>

CSS

table {
  width:100%;
}
tr {
  display:inline-table;
  width:40%;
}
tr:nth-of-type(2) {
  width:20%;
}

JavaScript

function splitTopNav(el) {
  var nextAllTrContent = $(el).nextAll();
  var newTr = $('<tr>');
  var listTr = newTr.append(nextAllTrContent);
  $(listTr).insertAfter($(el).parent());
  //following line doesn't work while line 8 does work
  //newTr.insertAfter($(el).parent());
  $('<tr>').insertAfter($(el).parent());
  $(el).closest('#topNav').addClass('splitTopNav');
}
splitTopNav('#item3');