dynamic css at class level

I have a JSP code like below.

<table id="mytable" cellspacing="0">
<tr data-depth="0" class="collapse level0">
<td></td>
<td></td>
<td></td>
</tr>
////...
/...//
<tr data-depth="<%=dataDepth%>" class="collapse level<%=dataDepth%>">
<td></td>
<td></td>
<td></td>
</tr>
</table>

and below is the css for class level

.level1 td:first-child {
    padding-left: 15px;
}
.level2 td:first-child {
    padding-left: 30px;
}
.level3 td:first-child {
    padding-left: 45px;
}
.level4 td:first-child {
    padding-left: 60px;
}
.level5 td:first-child {
    padding-left: 75px;
}

The above code for class is harcoded for level1,level2,level3,level4,level5. But from JSP code the class level is dynamic and can keep increasing based on <%=dataDepth%> and this has no limit. Can the css also change dynamically with respect to JSP code? Any examples or suggestions please?