JSFiddle - React, Tailwind, and code Playground
by Manna
HTML
<div id="q1" class="question">
Do you often get tired?
<input type="radio" name="radio_q1" value="Never"> Never
<input type="radio" name="radio_q1" value="Yes"> Yes
<div class="checks" id="q1_checks">
<input type="checkbox" name="check_q1" value="In the morning"> In the morning
<input type="checkbox" name="check_q1" value="In the afternoon"> In the afternoon
<input type="checkbox" name="check_q1" value="In the night"> At night
</div>
</div>
<br>
<div id="q2" class="question">
Do you ever sleep?
<input type="radio" name="radio_q2" value="Never"> Never
<input type="radio" name="radio_q2" value="Yes"> Yes
<div class="checks" id="q2_checks">
<input type="checkbox" name="check_q2" value="In the morning"> In the morning
<input type="checkbox" name="check_q2" value="In the afternoon"> In the afternoon
<input type="checkbox" name="check_q2" value="In the night"> At night
</div>
</div>
<br><button id="submit">SUBMIT</button>
CSS
.checks
{
display:none;
}
JavaScript
$(function() {
$('[name^=radio]').change(function(e) {
$(this).parent().find('.checks')
.toggle( $(this).val() == 'Yes' );
});
});