hiding nth child tr - html

Question

Apologize for the length of the code. I'm trying to hide the three cells that contain the $ I can't change the html but I can change the CSS. I've tried:
.extra-details table:nth-child(1) tr:nth-child(-n+4)
but that gets the first 4 rows in the second table as well. So my question is this, is there CSS I can use to hide the cell/rows that have the $ or suggestions on something to search for? cell values have been removed for brevity.
<div class="details_column">
<div class="column">
<table cellpadding="0" cellspacing="0">
<tbody>
<tr>
<td>
</td>
<td class="medium ">
</td>
</tr>
<tr>
<td>
Price
</td>
<td class="medium ">
$
</td>
</tr>
<tr>
<td>
</td>
<td class="medium ">
$
</td>
</tr>
<tr>
<td>
</td>
<td class="medium ">
$
</td>
</tr>
<tr>
<td>
</td>
<td class="medium ">
</td>
</tr>
<tr>
<td>
</td>
<td class="medium ">
</td>
</tr>
<tr>
<td>
</td>
<td class="medium ">
</td>
</tr>
<tr>
<td>
</td>
<td class="medium ">
</td>
</tr>
</tbody>
</table>
</div>
<div class="column">
<table cellpadding="0" cellspacing="0">
<tbody>
<tr>
<td>
</td>
<td class="medium ">
</td>
</tr>
<tr>
<td>
</td>
<td class="medium ">
</td>
</tr>
<tr>
<td>
</td>
<td class="medium ">
</td>
</tr>
<tr>
<td>
</td>
<td class="medium ">
</td>
</tr>
<tr>
<td>
</td>
<td class="medium ">
</td>
</tr>
<tr>
<td>
</td>
<td class="medium ">
</td>
</tr>
<tr>
<td>
</td>
<td class="medium ">
</td>
</tr>
<tr>
<td>
</td>
<td class="medium">
</td>
</tr>
</tbody>
</table>
</div>
</div>

Answer 1

In a single line the CSS to select just the <td> containing $ elements would be:
div.column:first-child table tr:nth-child(-n+4):not(:nth-child(1)) td:last-child {
border:2px dashed red;
}
as demonstrated in this fiddle. However, please note that this is only tested in Chrome.

Answer 2

To select a specific first occurrence of an element, use :first-of-type instead of :first-child. With the given structure, the following selector can be used to achieve your goal:
.details_column > *:first-of-type table tr:nth-child(2) td,
.details_column > *:first-of-type table tr:nth-child(3) td,
.details_column > *:first-of-type table tr:nth-child(4) td {
background:red;
}
Fiddle: http://jsfiddle.net/BaUYF/
Explanation of CSS:
Select any element with class details_column
Select the any element which is a first typem and contains a <table> child.
Select the 2nd, 3rd and 4th row. of these tables.
Select all cells in these rows
Apply a style
Note: The proposed selectors could be adjusted to match your exact wishes. I haven't used it, but the :not() selector could also be useful.