So. I have this table:
<table>
<tr>
<td>Element1</td>
<td>Element1</td>
<td>Element1</td>
<td><a id="btn" href=#">Accept</a></td>
</tr>
<tr>
<td>Element2</td>
<td>Element2</td>
<td>Element2</td>
<td><a id="btn" href=#">Accept</a></td>
</tr>
</table>
What I want to do is: Button gets clicked, it gets hidden and the respective <tr> gets border: 1px solid black;.
I'm kinda new to jQuery and can't figure out how to select the 2nd parent of an element. Any help would be appreciated
id value. you have to use classconst btns = document.querySelectorAll('.id');
btns.forEach((btn) => {
btn.addEventListener('click', (e) => {
e.preventDefault();
e.target.closest('tr').style.cssText = "border:1px solid black";
e.target.remove();
})
});table {
border-collapse: collapse
}<table>
<tr>
<td>Element1</td>
<td>Element1</td>
<td>Element1</td>
<td><a class="id" href=#">Accept</a></td>
</tr>
<tr>
<td>Element2</td>
<td>Element2</td>
<td>Element2</td>
<td><a class="id" href=#">Accept</a></td>
</tr>
</table>