JSFiddle - React, Tailwind, and code Playground

HTML

<a href = "#" class = "desplegar">Despliega</a>
<a href = "#" class = "recoger">Recoger</a>

<table>
    <tbody>
        <tr>
            <td>Uno <a href = "#" class = "nombre_alumno">Muestra/Oculta</a></td>
        </tr>
        <tr class="ocultable oculto">
            <td>Info Uno</td>
        </tr>
        <tr>
            <td>Dos <a href = "#" class = "nombre_alumno">Muestra/Oculta</a></td>
        </tr>
        <tr class="ocultable oculto">
            <td>Info Dos</td>
        </tr>
        <tr>
            <td>Tres <a href = "#" class = "nombre_alumno">Muestra/Oculta</a></td>
        </tr>
        <tr class="ocultable oculto">
            <td>Info Tres</td>
        </tr>
    </tbody>
</table>

CSS

table, table *{
    border: .1em solid;
}

.oculto{
    display: none;
}

a{
    color: red;
    text-decoration: none;
}

a:hover{
    color: green;
}

JavaScript

var r = $(".ocultable");

$('.nombre_alumno').click(function() {
    var ref = $(this).parents("tr").next();
    if (ref.hasClass("oculto"))
        ref.removeClass("oculto");
    else
        ref.addClass("oculto");
});

$('.desplegar').click(function() {
    r.removeClass("oculto");
});
 
$('.recoger').click(function() {
    r.addClass("oculto");
});