JSFiddle - React, Tailwind, and code Playground

HTML

<!-- Choose "Fate" -- Star Wars, Avengers, Batman, X-Men, Harry Potter, and the Lord of the Rings. If user clicks one of these radio buttons then JQuery causes the corresponding questions to display. --> <span>Choose Your Fate:</span>

<ul>
    <li>
        <label for="starwars">Star Wars
            <input type="radio" class="fate" name="fate" id="radio_starwars" value="starwars" checked="checked"/>
        </label>
    </li>
    <li>
        <label for="avengers">The Avengers
            <input type="radio" class="fate" name="fate" id="radio_avengers" value="avengers" />
        </label>
    </li>
    <li>
        <label for="batman">Batman
            <input type="radio" class="fate" name="fate" id="radio_batman" value="batman" />
        </label>
    </li>
    <li>
        <label for="xmen">The X-Men
            <input type="radio" class="fate" name="fate" id="radio_xmen" value="xmen" />
        </label>
    </li>
    <li>
        <label for="harryp">Harry Potter
            <input type="radio" class="fate" name="fate" id="radio_harryp" value="harryp" />
        </label>
    </li>
    <li>
        <label for="lotr">The Lord of the Ring
            <input type="radio" class="fate" name="fate" id="radio_lotr" value="lotr" />
        </label>
    </li>
</ul>
<!-- If user clicks on Star Wars -->
<div id="clicked_starwars" class="hidden_destiny2">	<span>Choose Your Destiny:</span>

    <label for="sith">Sith
        <input type="radio" class="" name="destiny" id="sith" value="sith" />
    </label>
    <label for="jedi">Jedi
        <input type="radio" class="" name="destiny" id="jedi" value="jedi" />
    </label>
</div>
<!-- If user clicks The Avengers -->
<div id="clicked_avengers" class="hidden_destiny">	<span>Choose Your Destiny:</span>

    <label for="shield">The Avengers
        <input type="radio" class="" name="destiny" id="shield" value="shield" />
    </label>
    <label for="lokiarmy">Loki's Army
        <input type="radio" class="" name="destiny"...

CSS

.hidden_destiny {
    display:none;
}
.hidden_destiny2 {
    display:;
}

JavaScript

$('.fate').click(function () {
    $('.hidden_destiny').each(function () {
        if ($(this).is(':visible')) {
            $(this).stop().slideUp('slow');
        }
    });
    var id = $(this).val();
    $('#clicked_' + id).stop().slideDown('slow');
});