选择所有“属于”特定 <th> 元素的 <td> 元素

Question

我想选择与具有data-something 属性的<th> 元素在同一列中的所有<td> 元素。

<table border="1">
    <tr>
        <th data-column="A">Column A</th>
        <th data-column="B">Column B</th>
        <th data-column="C">Column C</th>
        <th data-column="D">Column D</th>
    </tr>
    <tr>
        <td>Data A1</td>
        <td>Data B1</td>
        <td>Data C1</td>
        <td>Data D1</td>
    </tr>
    <tr>
        <td>Data A2</td>
        <td>Data B2</td>
        <td>Data C2</td>
        <td>Data D2</td>
    </tr>
    <tr>
        <td>Data A3</td>
        <td>Data B3</td>
        <td>Data C3</td>
        <td>Data D3</td>
    </tr>
    <tr>
        <td>Data A4</td>
        <td>Data B4</td>
        <td>Data C4</td>
        <td>Data D4</td>
    </tr>
    <tr>
        <td>Data A5</td>
        <td>Data B5</td>
        <td>Data C5</td>
        <td>Data D5</td>
    </tr>
</table>     

例如单击数据列A的按钮，我想选择属于A列的所有元素。

我为表格的视觉示例制作了快速表格：

Vanilla 或 jQuery（或一些轻量级库），我对这两种解决方案都持开放态度。谢谢。

Answer 1

$('table tr td:nth-child('+$("table th[data-column="desired value"]").index() + 1+')')