Move trough tr em diferentes tabelas com chaves e jquery - javascript, jquery

Desejo percorrer as linhas da tabela com as setas para cima e para baixo. Eu tenho esta marcação:

<table border="1">
<tr class="tableIndex highlight">
<td>Something</td>
<td>Something</td>
<td>Something</td>
</tr>
<tr class="tableIndex">
<td>Something</td>
<td>Something</td>
<td>Something</td>
</tr>
<tr class="tableIndex">
<td>Something</td>
<td>Something</td>
<td>Something</td>
</tr>
</table>
<table border="1">
<tr class="tableIndex">
<td>Something</td>
<td>Something</td>
<td>Something</td>
</tr>
<tr class="tableIndex">
<td>Something</td>
<td>Something</td>
<td>Something</td>
</tr>
<tr class="tableIndex">
<td>Something</td>
<td>Something</td>
<td>Something</td>
</tr>
</table>
<table border="1">
<tr class="tableIndex">
<td>Something</td>
<td>Something</td>
<td>Something</td>
</tr>
<tr class="tableIndex">
<td>Something</td>
<td>Something</td>
<td>Something</td>
</tr>
<tr class="tableIndex">
<td>Something</td>
<td>Something</td>
<td>Something</td>
</tr>
</table>

E este código jQuery JavaScript para navegar pelos itens:

$(function() {
function highlighting(tableIndex,className) {
// Just a simple check. If .highlight has reached the last, start again
var $trClass = $("."+className);
if( (tableIndex+1) > $trClass.length ) {
console.log("tableIndex > "+ $trClass.length);
tableIndex = 0;
}

// Element exists?
if($trClass.eq(tableIndex).length > 0)
{
// Remove other highlights
$trClass.removeClass("highlight");

// Highlight your target
$trClass.eq(tableIndex).addClass("highlight");
}
}
$(document).keydown(function (e) {
//first check if any input has focus
if($("input:focus").length == 0) {
switch (e.which) {
case 38:
//ARROW UP - move up
console.log("Current (up): " + $(".tableIndex").index());
highlighting(($(".tableIndex.highlight").index() - 1), "tableIndex");
break;
case 40:
console.log("Current (down): " + $(".tableIndex").index());
highlighting(($(".tableIndex.highlight").index() + 1), "tableIndex");
break;
}
}
})
console.log("Total: " + $(".tableIndex").length);
});

Isso funciona bem se eu tiver apenas uma mesa, mas nãoquando há várias tabelas. O comprimento do índice está correto (como 9 neste exemplo), mas a navegação está totalmente fora dos gráficos. Como se o primeiro item fosse -1 e tudo o mais se comportasse maluco. Posso navegar pelos itens 2 a 4 normalmente, mas quando subo no segundo item, ele pula para o último ... Não tenho ideia do porquê?

Eu coloquei um jsfiddel para isso aqui: https://jsfiddle.net/vog54ygo/6/

Respostas:

Posso estar entendendo seus requisitos incorretamente, mas acho que você recebeu uma resposta exagerada.

É isso que voce quer?

var $rows = $(".tableIndex");
var current = 0;

$(function() {

$(document).keydown(function (e) {

switch (e.which) {
case 38: //ARROW UP - move up
if(current > 0){
$rows[current].setAttribute("class", "");
$rows[current - 1].setAttribute("class", "highlight");
current--;
}
break;
case 40:
if(current <  $rows.length-1){
$rows[current].setAttribute("class", "");
$rows[current + 1].setAttribute("class", "highlight");
current++;
}
break;
}
});


});

.highlight {
background-color: yellow;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table border="1">
<tr class="tableIndex highlight">
<td>Something</td>
<td>Something</td>
<td>Something</td>
</tr>
<tr class="tableIndex">
<td>Something</td>
<td>Something</td>
<td>Something</td>
</tr>
<tr class="tableIndex">
<td>Something</td>
<td>Something</td>
<td>Something</td>
</tr>
</table>

<table border="1">
<tr class="tableIndex">
<td>Something</td>
<td>Something</td>
<td>Something</td>
</tr>
<tr class="tableIndex">
<td>Something</td>
<td>Something</td>
<td>Something</td>
</tr>
<tr class="tableIndex">
<td>Something</td>
<td>Something</td>
<td>Something</td>
</tr>
</table>

<table border="1">
<tr class="tableIndex">
<td>Something</td>
<td>Something</td>
<td>Something</td>
</tr>
<tr class="tableIndex">
<td>Something</td>
<td>Something</td>
<td>Something</td>
</tr>
<tr class="tableIndex">
<td>Something</td>
<td>Something</td>
<td>Something</td>
</tr>
</table>