Javascript - Locate TD width="70%" and add CSS

Is it possible to locate a TABLE with a TD that has a width of 70%, then add additional CSS using plain Javascript?

The TABLE doesnt have an ID, but its nested within a DIV with an ID.

HTML:

<div id="MainContent">
  <table width="100%">
    <tr>  </tr>
    <tr>  </tr>
    <tr>
      <td>
        <table width="100%">
          <tr>
            <td width="70%">
              ....
            </td>
          </tr>
         </table>
       </td开发者_运维百科>
     </tr>
.....

So #MainContent table THIRD-TR FIRST-TD TABLE TR TD

Any ideas and help appreciated!

Can you use jQuery?

$('td[width=100%]')

If not, this might be a function worth playing with:

http://snipplr.com/view/1853/get-elements-by-attribute/

Good luck.

Which table are you trying to get? This should get the first one:

document.getElementById('MainContent').getElementsByTagName('table')[0];

But this should get the second one:

var tds = document.getElementsByTagName('td'),
i = tds.length;
while (i) {
    i -= 1;
    if (tds[i].width === '70%') {
        tds = tds[i];
        break;
    }
}
do {
    tds = tds.parentNode;
} while (tds.nodeName !== 'TABLE')

At the end of all this, tds should be the first table that is the parent of that 70% td.