JSFiddle - React, Tailwind, and code Playground

by ifaour

HTML

<table id="myQuestions">
    <tr>
        <td>
            <select id="QuestionOptions">
                <option value="A">Question A</option>
                <option value="B">Question B</option>
            </select>
        </td>
    </tr>
</table>
<table id="myAnswers">
    <tr id="A" style="display: none;">
        <td id="QuestionC">
            <p>Here is an example question C.</p>
        </td>
        <td id="QuestionD">
            <select id="QuestionOptionsD">
                <option value="G">Question G</option>
                <option value="H">Question H</option>
            </select>
        </td>
    </tr>
    <tr id="B" style="display: none;">
        <td id="QuestionE">
            <p>Here is an example question E.</p>
        </td>
        <td id="QuestionF">
            <select id="QuestionOptionsF">
                <option value="I">Question I</option>
                <option value="J">Question J</option>
            </select>
        </td>
    </tr>
</table>

JavaScript

$(function() {
    $('#QuestionOptions').change(function() {
        $('tr', '#myAnswers').hide();
        $('#myAnswers').find('#' + $(this).val()).show();
    });
});