JSFiddle - React, Tailwind, and code Playground

HTML

<table class="table_database_edit">
    <tr>
        <td>Magazyn wycieraczek</td>
        <td>Edytuj</td>
        <td>Usuń</td>
    </tr>
    <tr class="more" id="">
        <td colspan="3">aa</td>
    </tr>
    <tr>
        <td>test</td>
        <td>Edytuj</td>
        <td>Usuń</td>
    </tr>
    <tr class="more" id="">
        <td colspan="3">aa</td>
    </tr>
    <tr>
        <td>Magazyn wycieraczek</td>
        <td>Edytuj</td>
        <td>Usuń</td>
    </tr>
    <tr class="more" id="">
        <td colspan="3">aa</td>
    </tr>
    <tr>
        <td>test</td>
        <td>Edytuj</td>
        <td>Usuń</td>
    </tr>
    <tr class="more" id="">
        <td colspan="3">aa</td>
    </tr>
    <tr>
        <td>Magazyn wycieraczek</td>
        <td>Edytuj</td>
        <td>Usuń</td>
    </tr>
    <tr class="more" id="">
        <td colspan="3">aa</td>
    </tr>
    <tr>
        <td>test</td>
        <td>Edytuj</td>
        <td>Usuń</td>
    </tr>
    <tr class="more" id="">
        <td colspan="3">aa</td>
    </tr>
    <tr>
        <td>Magazyn wycieraczek</td>
        <td>Edytuj</td>
        <td>Usuń</td>
    </tr>
    <tr class="more" id="">
        <td colspan="3">aa</td>
    </tr>
    <tr>
        <td>test</td>
        <td>Edytuj</td>
        <td>Usuń</td>
    </tr>
    <tr class="more" id="">
        <td colspan="3">aa</td>
    </tr>
    <tr>
        <td>Magazyn wycieraczek</td>
        <td>Edytuj</td>
        <td>Usuń</td>
    </tr>
    <tr class="more" id="">
        <td colspan="3">aa</td>
    </tr>
    <tr>
        <td>test</td>
        <td>Edytuj</td>
        <td>Usuń</td>
    </tr>
    <tr class="more" id="">
        <td colspan="3">aa</td>
    </tr>
</table>

CSS

table.table_database_edit {
    width: 100%;
    border-collapse:collapse;
    border-spacing: 0;
}
table.table_database_edit tr.groupOne {
    background-color: #fff;
}
table.table_database_edit tr.groupTwo {
    background-color: #EFF0F1;
}
table.table_database_edit tr.highlight {
    background-color: yellow;
}

JavaScript

//Add group classes to rows
$('table.table_database_edit tr').each(function () {
    if ($('.table_database_edit tr').index($(this)) + 1 !== 1 && ($('.table_database_edit tr').index($(this)) + 1) % 4 === 0) {
        $(this).removeClass('groupOne').addClass('groupTwo');
        $(this).prev().removeClass('groupOne').addClass('groupTwo');
    } else {

        $(this).addClass('groupOne');
        $(this).next().addClass('groupOne');
    }
});

//Highlight groups of two
$('table.table_database_edit tr').hover(function () {
    if ($('.table_database_edit tr').index($(this)) === 0 || $('.table_database_edit tr').index($(this)) % 2 === 0) {
        $(this).addClass('highlight');
        $(this).next().addClass('highlight');
    } else {
        $(this).addClass('highlight');
        $(this).prev().addClass('highlight');
    }
}, function () {

    $('.table_database_edit tr').removeClass('highlight');

});