JSFiddle - React, Tailwind, and code Playground

by Juan Muñoz

HTML

<table class="display dataTable no-footer" id="tblBancos" role="grid" style="width: 1236px;"><thead> 
            <tr role="row" style="height: 0px;"><th style="height: 0px; width: 16px; padding-top: 0px; padding-bottom: 0px; border-top-width: 0px; border-bottom-width: 0px;" class="sorting_disabled" rowspan="1" colspan="1"><div class="dataTables_sizing" style="height:0;overflow:hidden;">#</div></th><th style="height: 0px; width: 36px; padding-top: 0px; padding-bottom: 0px; border-top-width: 0px; border-bottom-width: 0px;" class="sorting_disabled" rowspan="1" colspan="1"><div class="dataTables_sizing" style="height:0;overflow:hidden;">FECHA</div></th><th class="sorting_disabled" rowspan="1" colspan="1" style="width: 492px; padding-top: 0px; padding-bottom: 0px; border-top-width: 0px; border-bottom-width: 0px; height: 0px;"><div class="dataTables_sizing" style="height:0;overflow:hidden;">GLOSA</div></th><th class="sorting_disabled" rowspan="1" colspan="1" style="width: 65px; padding-top: 0px; padding-bottom: 0px; border-top-width: 0px; border-bottom-width: 0px; height: 0px;"><div class="dataTables_sizing" style="height:0;overflow:hidden;">N≗ OPERACION</div></th><th class="sorting_disabled" rowspan="1" colspan="1" style="width: 64px; padding-top: 0px; padding-bottom: 0px; border-top-width: 0px; border-bottom-width: 0px; height: 0px;"><div class="dataTables_sizing" style="height:0;overflow:hidden;">GIRO </div></th><th class="sorting_disabled" rowspan="1" colspan="1" style="width: 78px; padding-top: 0px; padding-bottom: 0px; border-top-width: 0px; border-bottom-width: 0px; height: 0px;"><div class="dataTables_sizing" style="height:0;overflow:hidden;">DEPOSITO</div></th><th class="sorting_disabled" rowspan="1" colspan="1" style="width: 77px; padding-top: 0px; padding-bottom: 0px; border-top-width: 0px; border-bottom-width: 0px; height: 0px;"><div class="dataTables_sizing" style="height:0;overflow:hidden;">SALDO</div></th><th class="sorting_disabled" rowspan="1"...

JavaScript

$(document).ready(function (){
  var todo_elementos = [];
  var i = 0
  $('#tblBancos tbody tr').each(function (){
  	var da_te = $(this).find('td').eq(1).text().split("-");
  	var objeto = {"elemento" : da_te[0] , "indice": i, "fila": $(this)}
    todo_elementos.push( objeto )
    i++
    $(this).remove();
  });
  var cambio = todo_elementos.sort(ordena_filas);
  cambio.map(function (a,b){
  	$('#tblBancos tbody').append(a.fila)
  })
})

function ordena_filas(a,b) {
  return  a.elemento - b.elemento;
}