JSFiddle - React, Tailwind, and code Playground
by crucify
HTML
<table>
<tbody>
<tr id="thisrow">
<td>1</td>
<td>2</td>
<td>3</td>
</tr>
<tr>
<td>4</td>
<td>5</td>
<td>6</td>
</tr>
</tbody>
</table>
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js"></script>
<script>
$('#thisrow>td').on('click', function() {
if('2' == $(this).prop('rowspan')) {
$(this).closest('tr').next('tr').find('>td').eq($(this).index()).show();
$(this).prop('rowspan', 1);
} else {
$(this).closest('tr').next('tr').find('>td').eq($(this).index()).hide();
$(this).prop('rowspan', 2);
}
});
</script>
CSS
table { border-collapse:collapse; border:1px solid black; }
td { border:1px solid black; }