JSFiddle - React, Tailwind, and code Playground

HTML

<script src="//cdn.datatables.net/1.10.6/js/jquery.dataTables.min.js"></script>
<link rel="stylesheet" href="//cdn.datatables.net/1.10.6/css/jquery.dataTables.css">
<script src="//jquery-datatables-row-grouping.googlecode.com/svn/trunk/media/js/jquery.dataTables.rowGrouping.js"></script>
<table id="example">
    <thead>
        <tr>
            <th>Users</th>
            <th>Day</th>
            <th>Hours</th>
            <th>Desc</th>
            <th>Department</th>
            <th>Task</th>
            <th>Subtask</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>user 1</td>
            <td>2015-02-11 13:05:00</td>
            <td>2.0</td>
            <td>blabla</td>
            <td>Standard</td>
            <td>testing</td>
            <td>testen</td>
        </tr>
        <tr>
            <td>user 1</td>
            <td>2015-03-11 13:05:00</td>
            <td>1.0</td>
            <td>blbla</td>
            <td>Standard</td>
            <td>making coffee</td>
            <td>get milk</td>
        </tr>
        <tr>
            <td>peter</td>
            <td>2015-03-11 13:05:00</td>
            <td>1.0</td>
            <td>padsfs</td>
            <td>something</td>
            <td>PB</td>
            <td>test</td>
        </tr>
    </tbody>
</table>

CSS

tr:hover td.expanded-group
{
    background: url("http://jquery-datatables-row-grouping.googlecode.com/svn/trunk/media/images/minus.jpg") no-repeat scroll left center #c0e1ff !important;
}

td.collapsed-group
{
    background: url("http://jquery-datatables-row-grouping.googlecode.com/svn/trunk/media/images/plus.jpg") no-repeat scroll left center transparent;
}
tr:hover td.collapsed-group
{
    background: url("http://jquery-datatables-row-grouping.googlecode.com/svn/trunk/media/images/plus.jpg") no-repeat scroll left center #c0e1ff !important;
}

JavaScript

$(document).ready(function () {
    $('#example').dataTable({
        "bLengthChange": false,
        "bPaginate": false,
        "bJQueryUI": true
    }).rowGrouping({
        bExpandableGrouping: true,
        bExpandSingleGroup: false,
        iExpandGroupOffset: -1,
        asExpandedGroups: [""]
    });
});