melaos melaos - 1 month ago 9
jQuery Question

How to Jquery show only a particular td from this table structure?

I don't know how to query this one out.

I have a table structure that looks like this:

<table class="wba_main_table" align="center" border="0" cellpadding="0" cellspacing="0" width="">
<tbody>
<tr>
<td style="display: none;" id="wba_logo_bg">
</td>
</tr>
<tr>
<td style="display: none;" class="line">
</td>
</tr>
<tr>
<td class="wba_topnavBG">
<table>
<tr><td>bla bla bla</td></tr>
</table>
</td>
</tr>
<tr>
<td style="display: none;" class="line">
</td>
</tr>
<tr style="display: none;" class="greyBar">
<td>
</td>
</tr>
<tr>
<td style="display: none;" class="line">
</td>
</tr>
<tr>
<td style="display: none;" class="lightGreyBar">
</td>
</tr>
<tr>
<td><table><tbody><tr><td>
<div id="deep_div1"></div>
</td></tr></tbody></table></td>
</tr>
</table>


And what I wanted to do was to hide all the tr except for the one containing the
wba_topnavBG
. My strategy was to use the
wba_logo_bg
as id and select the parents then from there select all the children td which doesn't have the class
wba_topnavBG
and
hide()
them all, but I don't know how to write the selection part.

Any help? :)

Edit



Forgot to add that inside that td there's another table structure with more tr and tds.

Edit 2



Mmm, it appears now that I have to hide another tr which contains a table which contains a div with an id. can the jquery line be modified to add another thing to look for in it's :has syntax?


  1. How can I hide the other tr except
    for the one containing div
    deep_div1

    and the one with td class
    wba_topnavBG
    ?



As this new twist is still related to this question, I don't want to create another question in Stack Overflow.

CMS CMS
Answer

You can combine the :not and :has pseudo-selectors:

$('.wba_main_table tr:not(:has(td.wba_topnavBG))').hide();

This selector will match all the tr elements that do not contain a td element with class wba_topnavBG.

Check an example with your markup here.

Edit: In response to your comment, if you have a table inside that td, and you only want to select the direct tr descendants of .wba_main_table, you should use the parent > child selector:

$('.wba_main_table > tr:not(:has(td.wba_topnavBG))').hide();