JSFiddle - React, Tailwind, and code Playground

HTML

<head><meta charset='UTF-8'></head>
<BODY BGCOLOR=#FFFFCC>
<font face="Arial">
<style>
    #wow:hover {
      background-color: orange;
    }
</style>
<b>Hva synes du om mørke negler?</b><br>
<form method="POST" action="fierce.pl" id="myForm">
    <input type="radio" name="QUESTION" value="yes"> Digger mørke negler!<br>
    <input type="radio" name="QUESTION" value="no"> Greit nok men fortsetter med min gamle farge.<br>
    <input type="radio" name="QUESTION" value="maybe"> Bruker ikke neglelakk.<br><br>

    <input type="submit" id="wow" style="border: 4px solid purple; font-weight:bold;" value=" STEM ">
</form>

<script>
document.addEventListener('DOMContentLoaded', function() {
    var submitButton = document.getElementById('wow');
    submitButton.style.display = 'none'; // Hide the submit button initially

    var radios = document.getElementsByName('QUESTION');

    var radioSelected = false;

    // Add event listeners to radio buttons
    for (var i = 0; i < radios.length; i++) {
        radios[i].addEventListener('change', function() {
            if (this.checked) {
                submitButton.style.display = 'inline-block'; // Show the submit button
                radioSelected = true;
            }
        });
    }

    // Prevent form submission if no radio button is selected
    document.getElementById('myForm').addEventListener('submit', function(event) {
        if (!radioSelected) {
            event.preventDefault();
            alert('Velg et alternativ først');
        }
    });
});
</script>