JSFiddle - React, Tailwind, and code Playground

HTML

<form name="myform" method="POST" action="http://manutd.com" onsubmit="return checkForm()">
    <fieldset>
        <legend>Hi</legend>
        <label>Random text:</label>
        <input type="text" name="textfield">
        <div id="text"></div>
        <label>Email:</label>
        <input type="email" name="email">
        <div id="emailwarn"></div>
        <label>Tel:</label>
        <input type="tel" name="tel" maxlength="11">
        <div id="telwarn"></div>
        <label>Smoking:</label>
        <input type="radio" name="smoking" value="1">
        <label>Non-smoking:</label>
        <input type="radio" name="smoking" value="2">
        <div id="radiowarn"></div>
        <input type="submit" value="Submit Form">
        <input type="reset" value="Reset Form">
    </fieldset>
</form>

JavaScript

function checkForm() {
    var valid = false;
    var radios = document.getElementsByName("smoking");

    var i = 0;
    while (!valid && i < radios.length) {
       if (radios[i].checked) {
            valid = true;
        }
        i++;
    }

    if (!valid) {
        document.getElementById("radiowarn").innerHTML = "Please select one.";
        document.getElementById("radiowarn").style.display = "block";
    }

    return valid;
}