How to apply CSS to td of particular table?

Question

How to apply CSS to td of one particular table; excluding all other tables in web page?

<table class="pure-table fullWidth" id="ToBeApplied">
 <tbody>
  <tr class="pure-table-odd">
   <td>
    <label>Bank</label>
   </td>
   <td>
    <label>Japha Bank</label>
   </td>
  </tr>
 </tbody>
</table>
<table class="pure-table fullWidth" id="NotToBeApplied">
 <tbody>
  <tr class="pure-table-odd">
   <td>
    <label>Bank</label>
   </td>
   <td>
    <label>Japha Bank</label>
   </td>
  </tr>
 </tbody>
</table>

I want to apply CSS say

td {padding:23px;font-weight:bold}

• i want to apply it on td's of table having ID ''ToBeApplied''.
• I do not want to write a class and write same on each td of table
• I do not want it to apply on td's of second table have ID ''NotToBeApplied''

How to modify HTML and CSS to achieve above?

Answer 1

Use CSS selectors like,

#ToBeApplied td {padding:23px;font-weight:bold}

Answer 2

This should work (Assuming that you dont want to specify id for table)

table.pure-table:first-child td {padding:23px;font-weight:bold}

DEMO

Answer 3

This is what you want.

Check out this fiddle.

#ToBeApplied td {
    padding:23px;
    font-weight:bold
}

Here is the snippet.

#ToBeApplied td {
  padding: 23px;
  font-weight: bold
}

<table class="pure-table fullWidth" id="ToBeApplied">
  <tbody>
    <tr class="pure-table-odd">
      <td>
        <label>Bank</label>
      </td>
      <td>
        <label>Japha Bank</label>
      </td>
    </tr>
  </tbody>
</table>
<table class="pure-table fullWidth" id="NotToBeApplied">
  <tbody>
    <tr class="pure-table-odd">
      <td>
        <label>Bank</label>
      </td>
      <td>
        <label>Japha Bank</label>
      </td>
    </tr>
  </tbody>
</table>