javascript - 在 DIV 单击上，选中多个复选框(名称不同)

Question

我的单选按钮是动态命名的。如何选中 div 单击上的所有复选框。 div 和每个 radio 都有唯一的 id。 div 实际上代表卡片。我想在单击卡片时如何选择 div 中列出的所有 radio 如何从javascript动态获取所有子节点但检查所有单选

<div id=<?= ($counter-1) ?> class="card categoryCard" style="width: 18rem;">
  <div class="card-body">
    <h5 class="card-title"><?= $rows[$counter-1]["TICKETDESCRIPTION"]?></h5>
    <input type="radio" id=<?='TICKETDESCRIPTION'.($counter-1) ?> name="TICKETDESCRIPTION" >
    <p class="card-text"><label>RM <?= $rows[$counter-1]["TICKETPRICE"]?></label></p>
    <input type="radio" id=<?='TICKETPRICE'.($counter-1) ?> name="TICKETPRICE" >
  </div>
</div>

下面是我的javascript代码

$('.categoryCard').click(function(){
    var id = $(this).attr('id');
    var radiobtn = document.getElementById("TICKETDESCRIPTION"+id);
    radiobtn.checked = true;
    alert(id);
});

Answer 1

// assuming jquery

$('.categoryCard').click(function(e){
   $('input[type="radio"]', this).each( function( i) {
     $(this).prop('checked', true);

   });

});