jQuery Selector to find content of td

Question

My HTML structure looks something like below:

<div id="mainDiv">
<table></table>
<table></table>
<table>
<tr>
<td id="first">FirstCell</td><td id="second">SecondCell</td>
</tr>
<tr>
<td></td><td></td>
</tr>
</table>
</div>

Now I would like the find the content of second td based on the value of first td.

I have tried following but didn't seem to work.

$("#mainDiv tr td:contains('first')").each(function(){
                var secondCell = $(this).find('#second').value();
            });

Any help will be highly appreciated.

change `var secondCell = $(this).find('#second').value();` to `var secondCell = $(this).next().text();` — Prasenjit Kumar Nag, Jun 14 '12 at 04:39

score 4 · Accepted Answer · answered Jun 14 '12 at 04:42

Based on your html structure you can achieve what you want like this

$("#mainDiv tr td:contains('First')").each(function(){
                var secondCell = $(this).next().text();
                console.log(secondCell);
            });

Working Fiddle

Like @Blender said .value() is not a function, use .text() instead.

score 1 · Answer 2 · answered Jun 14 '12 at 04:43

1

value is not a valid method.

You should use one of these as per requirement.

.html()  // for html content.
.text()  // for text content.
.val()   // for value attribute. Like value of input element.

answered Jun 14 '12 at 04:43

Subir Kumar Sao

8,171
3
26
47

I wouldn't list `.val()`. That function is only for input elements and will just confuse people. – Blender Jun 14 '12 at 04:46
1

I have mentioned that in the comment. – Subir Kumar Sao Jun 14 '12 at 04:48

score 0 · Answer 3 · answered Jun 14 '12 at 04:39

.value() isn't a function. You're probably looking for .text().

Looking at your structure, I see that you are looking for #second relative to #first. Are there multiple elements that have id="second"? If so, you're going to run into a lot of trouble with jQuery, as the id attribute is meant to be unique to a single element. You should be using class instead of id if the property is used to identify more than one element.

Ram · Answer 4 · 2012-06-14T04:49:43.517

0

as you are using each, instead of an id, class names should be used, try this:

$("#mainDiv tr td:contains('first')").each(function(){
    var secondCell = $(this).siblings('.second').text();
});

edited Jun 14 '12 at 04:49

answered Jun 14 '12 at 04:43

Ram

143,282
16
168
197

score 0 · Answer 5 · edited May 23 '17 at 10:26

when you say find, do you mean using regex? or by relationship of/to the first.

If by relationship, then this will work

$("#mainDiv tr td:contains('first')").each(function(){
            var secondCell = $(this).next().html();
        });

.text() is sometimes better than .html() depending on what you are doing. See here for working example and more info.

If by Regex, you will have to provide what it is you are looking for in the first <td>.

jQuery Selector to find content of td

5 Answers5

Linked