JSFiddle - React, Tailwind, and code Playground

by yijiang

HTML

<div>Condition name 
    <span class="radio">
        <input type="radio" name="condition_selection" value="yes" id="yes" />
        <label for="yes">Yes</label>
        <input type="radio" name="condition_selection" value="no" id="no" />
        <label for="no">No</label></span>
    <p class="add_qns">
        <label for="condition_qns">This is an additional question asked if I chose yes: </label>
        <input type="text" name="condition_qns" id="condition_qns" />
    </p>
</div>

JavaScript

$('.add_qns').hide();

$('.radio :radio').change(function(){
    if(this.value === 'yes'){
        $(this).parent().next('.add_qns').show();
    } else {
        $(this).parent().next('.add_qns').hide();
    }
});