Jquery getting the html from specific class within a table

Question

I have a table and I wish to extract the html from a specific row without a specific class.

So for example with the row:

<tr>
<th class='a'></th>
<th class='b'></th>
<th class='c'></th>
<tr>

I would hope to get a result like

<th class='b'></th>
<th class='c'></th>

I've attempted a few variants of

var newTr = $('#table01 tr:nth-child(2) .a').remove().html();

But it's not returning the desired result and it's removing the th's from the original rows(as expected I guess)

Would it be best to use a regex to strip the content out or is there a jQuery selector I can use?

Are you trying to return the contents of the <th> with the class "a"? I.e. from <th class="a">ASDF</a> you would want ASDF? — Mervyn
– Mervyn, Commented Jun 25, 2010 at 16:49

Jonathan Lonowski · Accepted Answer · 2010-06-25 17:16:37Z

2

If you're wanting the HTML of the row, you need to point jQuery to the <tr> for .html() while .remove() would still need it to point to the <th>.

However, after .remove(), you won't be able to simply traverse from <th> to <tr> as they won't be related (e.g., via .parent()). To get around this, you can use a series of .find() and .end() to point to the <th> just long enough for .remove:

$('#table01 tr:nth-child(2)').
    find('.a').remove().end().
    html();

jQuery begins with the <tr> w/ :nth-child(2)
.find() will move to the <th class="a">, which you .remove()
.end() will return to the <tr>, to grab the remaining .html()

Also, if you don't actually want to affect the table -- just the result -- toss in a .clone():

$('#table01 tr:nth-child(2)').clone().
    find('.a').remove().end().
    html();

edited Jun 25, 2010 at 17:16

answered Jun 25, 2010 at 17:03

Jonathan Lonowski

124k35 gold badges203 silver badges202 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Shane Over a year ago

Perfect, that was exactly what I've been looking for!

Babiker · Accepted Answer · 2010-06-25 16:50:11Z

0

Take a look at .index()'s manual

answered Jun 25, 2010 at 16:50

Babiker

18.9k28 gold badges83 silver badges127 bronze badges

Comments

John Boker · Accepted Answer · 2010-06-25 16:58:39Z

0

var ths = $('#table01 tr:nth-child(2) th').not('.a').clone().html();

Maybe something like that. It's hard to answer on an iPod touch.

answered Jun 25, 2010 at 16:58

John Boker

83.8k17 gold badges101 silver badges130 bronze badges

Collectives™ on Stack Overflow

Jquery getting the html from specific class within a table

3 Answers 3

1 Comment

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

1 Comment

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related