如何 select Jquery onclick 第一个元素中的所有嵌套输入同级

Question

I need to Checks all input those are inside labels on click "check-all" class. I have tried by nextAll() method but it's not working. kindly help

 $('.check-all').click(function() { alert('asdasd'); $(this).nextAll('input').prop('checked', 'true'); })

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <div class="toggle-check-group"> <a><img src="img/select_all.png" class="check-all" /></a> <label class="switch"> <input type="checkbox" class="myinput" /> <span class="slider">Ankit</span> </label> <label class="switch"> <input type="checkbox"/> <span class="slider">Mohal</span> </label> <label class="switch"> <input type="checkbox"/> <span class="slider">Kamal</span> </label> </div> <div class="toggle-check-group"> <a><img src="img/select_all.png" class="check-all" /></a> <label class="switch"> <input type="checkbox" class="myinput" /> <span class="slider">Ankit</span> </label> <label class="switch"> <input type="checkbox"/> <span class="slider">Mohal</span> </label> <label class="switch"> <input type="checkbox"/> <span class="slider">Kamal</span> </label> </div>

Answer 1

you can:

• use closest method to get closest parent of check-all with class toggle-check-group
• use find method to get all input child of toggle-check-group

if you want to check/uncheck all check bow with the.check-all elements

an idea can be to store the checked state of the first check box and apply it to all sibling ones

var isCheck = inputs.first().prop('checked');

 $('.check-all').click(function() { var inputs = $(this).closest('.toggle-check-group').find('input'); var isCheck = inputs.first().prop('checked'); inputs.prop('checked',;isCheck) })

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <div class="toggle-check-group"> <a><img src="img/select_all.png" class="check-all" /></a> <label class="switch"> <input type="checkbox" class="myinput" /> <span class="slider">Ankit</span> </label> <label class="switch"> <input type="checkbox"/> <span class="slider">Mohal</span> </label> <label class="switch"> <input type="checkbox"/> <span class="slider">Kamal</span> </label> </div> <div class="toggle-check-group"> <a><img src="img/select_all.png" class="check-all" /></a> <label class="switch"> <input type="checkbox" class="myinput" /> <span class="slider">Ankit</span> </label> <label class="switch"> <input type="checkbox"/> <span class="slider">Mohal</span> </label> <label class="switch"> <input type="checkbox"/> <span class="slider">Kamal</span> </label> </div>