JSFiddle - React, Tailwind, and code Playground

by David Thomas

HTML

<label>
    <input type="radio" id="postageyes" name="postage" value="Yes" />Yes</label>
<label>
    <input type="radio" id="postageno" name="postage" value="No" />No</label>
<div id="conditional">
    <p>This should only show when the 'Yes' radio &lt;input&gt; element is checked.</p>

JavaScript

// caching a reference to the dependant/conditional content:
var conditionalContent = $('#conditional'),
    // caching a reference to the group of inputs, since we're using that
    // same group twice:
    group = $('input[type=radio][name=postage]');

// binding the change event-handler:
group.change(function () {
    // toggling the visibility of the conditionalContent, which will
    // be shown if the assessment returns true and hidden otherwise:
    conditionalContent.toggle(group.filter(':checked').val() === 'Yes');
    // triggering the change event on the group, to appropriately show/hide
    // the conditionalContent on page-load/DOM-ready:
}).change();