Изменить CSS определенной строки на клик, а не кнопку

Question

Итак, у меня есть эта кнопка, вы нажимаете ее, и она меняет background color от синего до красного. Если бы я хотел, чтобы эта кнопка меняла row background color, как бы я это сделал? Это тоже в цикле, поэтому все классы одинаковы, я использую приведенный ниже код, поэтому он меняет только то, что я щелкнул, а не все с этим классом.

сценарий

<script type="text/javascript"> 
$('.a-row').on('click', '.H', function() { 
    $(this).css("background-color", "red"); 
}); 
</script> 

HTML/PHP

<tr class="a-row"> 
<td><p class="pname"><?=$row["Name"]?></p><p class="clickbutt H">H</p></td> 
<td>stuff</td> 
<td>stuff2</td> 
<td>stuff3</td> 
</tr> 

Answer 1

Вы можете использовать метод .parents()

<script type="text/javascript"> 
$('.a-row').on('click', '.H', function() { 
    $(this).parents("tr").css("background-color", "red"); 
}); 
</script> 

Example

Answer 2

Вы можете использовать .closest('tr'):

$('.a-row').on('click', '.H', function() { 
    $(this).closest('tr').css("background-color", "red"); 
}); 

jquery .closest()

Answer 3

Вы можете попробовать метод .closest() в JQuery, как так.

<script type="text/javascript"> 
$('.H').on('click', function() { 
    $(this).closest.('tr').css("background-color", "red"); 
}); 
</script> 

Здесь вы можете ознакомиться с документом. https://api.jquery.com/closest/

Надеюсь, это было полезно.