I want to change the "Yes! Pick me" into "Picked" with Jquery in the following HTML structure, I used $('#myDiv>table>tr>td>table>tr').eq(1).text("Picked"); But it was not working. Could someone shed some light on this please? Thanks!

FYI, the first td of the the first table itself contains another table...

 <div id="myDiv">
    <table>
      <tr>
        <td>
          <table>
            <tr>
              <td>Yes! Pick me!</td>

              <td>Not me..</td>
            </tr>

            <tr>
              <td>Not me..</td>
            </tr>
          </table>
        </td>

        <td>Not me..</td>
      </tr>

      <tr>
        <td>Not me..</td>
      </tr>
    </table>
  </div>

The section $('#myDiv>table>tr>td>table>tr>td').eq(1).text("Picked"); does the trick, I forgot the last td part. Thanks to Rocket and everyone's help.

I want to change the "Yes! Pick me" into "Picked" with Jquery in the following HTML structure, I used $('#myDiv>table>tr>td>table>tr').eq(1).text("Picked"); But it was not working. Could someone shed some light on this please? Thanks!

FYI, the first td of the the first table itself contains another table...

 <div id="myDiv">
    <table>
      <tr>
        <td>
          <table>
            <tr>
              <td>Yes! Pick me!</td>

              <td>Not me..</td>
            </tr>

            <tr>
              <td>Not me..</td>
            </tr>
          </table>
        </td>

        <td>Not me..</td>
      </tr>

      <tr>
        <td>Not me..</td>
      </tr>
    </table>
  </div>

The section $('#myDiv>table>tr>td>table>tr>td').eq(1).text("Picked"); does the trick, I forgot the last td part. Thanks to Rocket and everyone's help.

• javascript
• html
• jquery
• html-table
• jquery-selectors

• 1 why don't you give ids for the fields you want to select? – Neysor Commented Feb 24, 2012 at 20:59
• Hi Neysor, b/c that part of the code is auto generated by an ASP user control. I'm just posting a sample code here to show similar structure for easier reference. thx – eastboundr Commented Feb 24, 2012 at 21:02
• Hi, Rocket, worked like a charm! Thanks a Ton!!! Sloppy me~ – eastboundr Commented Feb 24, 2012 at 21:05

6 Answers 6

Try this:

$("#myDiv table table td:first").text("Picked")

$('#myDiv').find('table table td').eq(0).text(...);

Start your selection at the #myDiv element ($('#myDiv')), then find all the TD element that are inside a table that is inside another table (.find('table table td')), then only alter the first one (.eq(0)).

Documentation:

• .find(): http://api.jquery./find
• .eq(): http://api.jquery./eq

The main problem is that you want .eq(0) not .eq(1) as .eq() is 0-based, and you are not selecting the td, only the tr.

Other than that using > direct descendant selectors makes your selection not very robust at all.

Try $('#myDiv table table td').eq(0).text('Picked');

You can try:

$("td:contains('Yes! Pick me!')").text("Picked"); ​

You can use the :contains(text) selector

$('#myDiv td table td:contains(Yes! Pick me!)').text('Picked');

Be careful with nested tables however because if you were to use just

$('#myDiv td:contains(Yes! Pick me!)').text('Picked');

You would get both the cell your after plus the cell it is nested within.

Your child selector query won't work because HTML5 requires the parser to insert <tbody> elements inside your <table> elements, since you've forgotten to put them in yourself. Perhaps you should consider validating your HTML?