How to show or hide div or form element with jquery?

How to show or hide div or form element with jquery?

I am trying to show or hide fieldset based on the answer selected on
YES/NO radio button. I have multiple form elements that has to be shown or
hidden based on their corresponding YES/NO radio button. But the code
below is not working for me. Could someone help me to correct this
problem?
<!-- My Form Element -->
<form>
<fieldset id="question">
<legend>This is my question</legend>
<label for="answerYes">Yes</label>
<input name="answer" class="myradio" type="radio" value="1" />
<label for="answerNo">No</label>
<input name="answer" class="myradio" type="radio" value="0" />
</fieldset>
<fieldset class="subQuestion">
<legend>This is my question</legend>
<label for="answerYes">Yes</label>
<input name="answer" class="subradio" type="radio" value="1" />
<label for="answerNo">No</label>
<input name="answer" class="subradio" type="radio" value="0" />
</fieldset>
</form>
// Jquery to show or hide subQuestion
$(document).ready(function(){
// do your checks of the radio buttons here and show/hide what you want to
$(".subQuestion").hide();
$(document).on('click', '.myradio' , function() {
if ($(this.value).length > 0){
$(".subQuestion").show();
}
else {
$(".subQuestion").hide();
}
})
});