JSFiddle - React, Tailwind, and code Playground

HTML

<table>
<tr id='OK1' class='parent'><td>Родитель 1</td></tr>
<tr class='child OK1'><td>Потомок 1.1</td></tr>
<tr class='child OK1'><td>Потомок 1.2</td></tr>
<tr class='child OK1'><td>Потомок 1.3</td></tr>
<tr id='OK2'class='parent'><td>Родитель 2</td></tr>
<tr class='child OK2'><td>Потомок 2.1</td></tr>
<tr class='child OK2'><td>Потомок 2.2</td></tr>
</table>

CSS

tr.child {
  display: none;
  font-size: 0.9em;
}

tr.child td {
  padding-left: 1em;
}

tr {
  cursor: pointer;
}

JavaScript

$(function() {
	$('tr.parent').click(function() {
  	if ($(this).hasClass('childsVisible')) {
    	$('tr.'+$(this).removeClass('childsVisible').attr('id')).hide();
    } else {
    	$('tr.'+$(this).addClass('childsVisible').attr('id')).show();
    }
  });
});