Question 108346 in Jquery Question posted in
The official Jquery Api Documentation can be found here.

Jquery – How to hide all TR whit especific TD?

Look this table.

<table id='tab'>
    <tr><td>AAA</td><td class='hidable'>BBB</td></tr>
    <tr><td>CCC</td><td>DDD</td></tr>
    <tr><td>EEE</td><td>FFF</td></tr>
    <tr><td>GGG</td><td class='hidable'>HHH</td></tr>
    <tr><td>III</td><td class='hidable'>JJJ</td></tr>
    <tr><td>KKK</td><td>LLL</td></tr>
    <tr><td>MMM</td><td class='hidable'>NNN</td></tr>
</table>

In this table, how can I hide all TR that contains a TD with class = ‘hidable’?

Thank you.

Tags:

2

Answers


  1. 0

    Use .has():

    $('#tab tr').has('td.hidable').hide();
    Login or Signup to reply.
  2. 0

    For someone looking for how to do this with pure JS:

    Consider the following code:

    <script>
let trs = document.querySelectorAll("tr");
let tds;
trs.forEach(tr =>{ 
  tds=tr.querySelectorAll("td");
  tds.forEach( td =>{
    if(td.hasAttribute("class", "hidable")){
     tr.setAttribute("hidden","");
    }
  });
});
</script>

    Hope you find this useful!

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search