How to remove [style="display: table-row"] added by tablesorter to each row in the table?

Question

I want to set child rows in the table collapsible. It is possible using the bootstrap collapse. But it does not work since tablesorter adds somewhere style="display: table-row", so it is visible always.

Where could I remove this css style?

Answer 1

Define a css class like this

.invisible-table tr {
    display: none !important;
}

and then just add/remove the invisible-table class to tablesorter as you wish.

Answer 2

The workaround in your comments posted by @Onimusha is your best option. The tablesorter code is adding that style inline to the DOM elements of "TR" programmatically. The only other option would be to edit the source of the tablesorter javascript to remove that inline style addition, and compile into your own custom tablesorter-min.js

I suggest the workaround as the elegant solution.

  $(".tablesorter tr").css("display", "");