JSFiddle - React, Tailwind, and code Playground

by gromer

HTML

<html>
    <head>
    <link rel="stylesheet" type="text/css" href="http://code.jquery.com/ui/1.8.24/themes/base/jquery-ui.css" />
            <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script>
        <script type="text/javascript" src="http://code.jquery.com/ui/1.8.24/jquery-ui.min.js"></script>
       </head>
    <body>
<table class="data sortable organismos">
        <thead>
            <tr style="display: table-row;">
                <th><a title="Ordenar por Nombre" class="sort" onclick="morfosSetOrder('organo_gestor_unidad_tramitadora_filters','orga.nombre','ASC','');return false;" id="order_orga.nombre_ASC" href="#">Nombre </a>
     </th>
                <th><a title="Ordenar por Codigo Dir" class="sort" onclick="morfosSetOrder('organo_gestor_unidad_tramitadora_filters','ud.codigo_dir','ASC','');return false;" id="order_ud.codigo_dir_ASC" href="#">Codigo Dir </a>
     </th>
            </tr>
        </thead>
        <tbody>
                            <tr class="accordion even">
                    <td><a href="#">Organo Gestor Defensa</a></td>
                    <td>E00003301</td>
                </tr>
                                    <tr class="unidad_tramitadora odd" style="display: none;">
                        <td>pagador unidad militar</td>
                        <td>E04720502</td>
                    </tr>
                                            <tr class="accordion even">
                    <td><a href="#">Organo Gestor Economia y Hacienda</a></td>
                    <td>E04583801</td>
                </tr>
                                    </tbody>
    </table>

    </body>
    </html>

JavaScript

$(document).ready(function(){
  $(".organismos tr:not(.accordion)").hide();
  $(".organismos tr:first-child").show();

  $(".organismos tr.accordion").click(function(event){
      event.preventDefault();
      $(this).nextAll("tr.unidad_tramitadora").slideToggle("slow");
  }).eq(0).trigger('click');
});