jQuery: Get from children and hide using ID

Viewed 30

this may be a basic one, but I'm confused on how I'll hide an input type radio and using the .find() in jquery. Here are the codes:

blade:

 <div class="col-lg-6 col-md-4 pt-4" id="radio_col">
    <h5>Sample: <span class="etc_class" hidden><small>(Sample)</small></span></h5>
    <input type="radio" name="mode" value="sample_one" id="sample_one" class="bootstrap-switch etc">
    <label for="sample_one">Sample One</label><br>

    <input type="radio" name="mode" value="sample_two" id="sample_two" class="bootstrap-switch etc">
    <label for="sample_two">Sample two</label><br>

So, I need to access the ID "radio_col" first and then use .find() to access the ID "sample_two" for me to hide the one that has an ID of "sample_two"...but when I tried this code in the script

  var find = $( "#radio_col" ).find('#sample_two');
  find.attr('hidden', true);

this somehow does not hide the ID with "sample_two" or did I do it wrong in the script part? Can anyone help a hand here? Thank you.

1 Answers

  $('#sample_two').attr('hidden', true);
var find = $( "#radio_col").find("label[for=sample_two]").hide()
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="col-lg-6 col-md-4 pt-4" id="radio_col">
    <h5>Sample: <span class="etc_class" hidden><small>(Sample)</small></span></h5>
    <input type="radio" name="mode" value="sample_one" id="sample_one" class="bootstrap-switch etc">
    <label for="sample_one">Sample One</label><br>

    <input type="radio" name="mode" value="sample_two" id="sample_two" class="bootstrap-switch etc">
    <label for="sample_two">Sample two</label><br>

Related