CODEWITHSUNDEEP
jqueryhtml-table
rchiriboga
rchiriboga

Reputation: 187

Find first and second td ONLY from table using jQuery

I am trying to only manipulate those two TD's. There are a ton of nested tables that are on very old code that cannot be changed.

the table has no class. but the main structure i can see is like this.

<table>
  <tr>
    <td class="nowrap" "bunch of inline stuff"></td>
    <td "bunch of inline stuff">
  </tr>
</table>

that is what I can see. the rest thats inside, i dont really care about but its all nested tables.

I want to be able to change all the "bunch of inline stuff" for ONLY those two td's but everything I seem to try runs all through the nested stuff.

any help would be appreciated. If you can tell me what I did wrong, that would be great too.

this is everything I have tried already

//$('#main_content_wrapper table:first tbody tr td:nth-child(1)').attr('width','240').attr('id','ezweb_lhr').css('background','lime');
//$("#main_content_wrapper table:first td:nth-child(1)").attr('width','240').attr('id','ezweb_lhr').css('background','lime');
//$("#main_content_wrapper table:first tr:nth-child(1) td:nth-child(1)").attr('width','240').attr('id','ezweb_lhr').css('background','lime');
//$("#main_content_wrapper table tr:nth-child(1) td:nth-child(2)").attr('width','680').attr('id','ezweb_content').css('padding-left','20px').css('background','red');

Upvotes: 0

Views: 1840

Answers (3)

rchiriboga
rchiriboga

Reputation: 187

Basically used another piece that was unique in the second TD which was the inline width. So for anyone else that might go through this, this is what i used.

$("#main_content_wrapper table:first tbody tr:first td[width='647']")

Upvotes: 0

Phil
Phil

Reputation: 11175

This will return all the td's in the first table:

$("main_content_wrapper table:first").find("tr:first").find('td');

Complete selection:

$("#main_content_wrapper table:first").find("tr:first").find('td')
    .attr({
        'width': '240',
        'id' : 'ezweb_1hr'
    }).css('background','lime');

Here is a working example: jsFiddle

Upvotes: 1

Paritosh Singh
Paritosh Singh

Reputation: 6384

You can try this

$("#main_content_wrapper table:first").find("td")

this will give you an array of all elements which are td inside first table, which is inside element with id 'main_content_wrapper'. Using indexes you can find whether it is first or second. For eg, to access nth td element use

var nth_elem = $("#main_content_wrapper table:first").find("td")[n-1]

Remember ':nth-child' selector does not work in IE7 and IE8

Thanks

Upvotes: 0

Related Questions