Mover a través de tr en diferentes tablas con claves y jQuery - javascript, jquery

Quiero moverme por las filas de la tabla con las flechas hacia arriba y hacia abajo. Tengo este marcado:

<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>

Y este código JavaScript jQuery para navegar a través de los elementos:

$(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);
});

Esto funciona bien si solo tengo una mesa pero nocuando hay varias tablas. La longitud del índice es correcta (como 9 en este ejemplo) pero la navegación está totalmente fuera de lugar. Como si el primer elemento fuera -1 y luego todo lo demás se comporta como loco. Puedo navegar a través de los elementos 2-4 normalmente, pero cuando subo en el segundo elemento, salta al último ... simplemente no tengo ni idea de por qué?

Puse un jsfiddel para esto aquí: https://jsfiddle.net/vog54ygo/6/

Respuestas

Puede que esté entendiendo sus requisitos incorrectamente, pero creo que tiene una respuesta pensada demasiado.

¿Es esto lo que quieres?

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>