JavaScriptで親の親要素を非表示にするにはどうすればいいですか？

Question

私はこのコードを持っています。「Accept」ボタンをクリックすると、<tr>タグがスタイル 'display：none;'によって隠されます。現時点では、ボタンは<td>を隠しており、私はそれがそうであることを望んでいません。テーブル全体を隠しておきたい。

<table class="table table-bordered"> 
    <tr> 
    <th>Name</th> 
    <th>Username</th> 
    <th>Email</th> 
    <th>Skype</th> 
    <th>Phone</th> 
    <th>Message</th> 
    <th>Accept?</th> 
    </tr> 
    <tr style=""> 
    <td>Name</td> 
    <td>Username</td> 
    <td>email@gmail.com</td> 
    <td>skypename</td> 
    <td>phone</td> 
    <td>MESSAGE</td> 
    <td><button onclick="this.parentElement.style.display='none';" class="btn btn-success">Accept</button> <button class="btn btn-danger">Deny</button></td> 
    </tr> 
</table> 

Answer 1

ちょうどこれを行うにそれを行うことができます。

<button onclick="this.parentElement.parentElement.style.display='none';" class="btn btn-success">Accept</button> 

Answer 2

あなたはjQueryのを言及しているので、あなたは、このよう

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<table class="table table-bordered"> 
 
     <tr> 
 
     <th>Name</th> 
 
     <th>Username</th> 
 
     <th>Email</th> 
 
     <th>Skype</th> 
 
     <th>Phone</th> 
 
     <th>Message</th> 
 
     <th>Accept?</th> 
 
     </tr> 
 
     <tr style=""> 
 
     <td>Name</td> 
 
     <td>Username</td> 
 
     <td>email@gmail.com</td> 
 
     <td>skypename</td> 
 
     <td>phone</td> 
 
     <td>MESSAGE</td> 
 
     <td><button onclick="$(this).parents('tr').hide()" class="btn btn-success">Accept</button> <button class="btn btn-danger">Deny</button></td> 
 
     </tr> 
 
    </table>