Select the first occurence of a child element with a class

Question

Need to select the first td that is not hidden from this table. That is the first td having the class ts-wrap

<table>
    <tr class="ts-row">
        <td style="display:none;">&nbsp;</td>
        <td style="display:none;">&nbsp;</td>
        <td style="text-align:right;" class="ts-wrap" colspan="2">Select Me</td>
        <td style="text-align:right;" class="ts-wrap" colspan="2"></td>
        <td style="text-align:right;" class="ts-wrap" colspan="2"></td>
        <td style="text-align:right;" class="ts-wrap" colspan="2"></td>
    </tr>
    <tr class="ts-row">
        <td style="display:none;">&nbsp;</td>
        <td style="display:none;">&nbsp;</td>
        <td style="text-align:right;" class="ts-wrap" colspan="2">Select Me too</td>
        <td style="text-align:right;" class="ts-wrap" colspan="2"></td>
        <td style="text-align:right;" class="ts-wrap" colspan="2"></td>
        <td style="text-align:right;" class="ts-wrap" colspan="2"></td>
    </tr>
</table>

Tried .ts-row td.ts-wrap:first-child and .ts-row td.ts-wrap:first-of-type in both CSS and jQuery; both of them are not for this scenario

.ts-row td.ts-wrap:first is working for jQuery but not a valid CSS selector.

How to achieve this in CSS?