JSFiddle - React, Tailwind, and code Playground

by paulkd

HTML

<p>Grade <select id="grade" name="grade">
    <option value="">Please select...</option>
    <option value="1">Fully Successful</option>
    <option value="2">Exceptional</option>
    <option value="3">Needs improvement</option>
    </select> 
    <span class="hidden" id="datefield">Enter date (dd/mm/yy): <input name="improvement-date" type="text" size="8"></span></p>

CSS

.hidden {display:none;}

JavaScript

$("#grade").on("change",function(){
        if($(this).val()==3) {
            $("#datefield").removeClass("hidden");
        } else {
            $("#datefield").val("").addClass("hidden");
        }
    });