JSFiddle - React, Tailwind, and code Playground

HTML

<tr>
            <td>
            <figures1></figures1>
            </td>
        <td class="questiona">
            <br>
            <input class="answer" type="radio" name="q1" value="a"/>a<br>
            <input class="answer" type="radio" name="q1" value="b"/>b<br>
            <input class="answer" type="radio" name="q1" value="c"/>c<br>
            <input class="answer" type="radio" name="q1" value="d"/>d<br>
        </td>
    </tr>
                <div id="dialog"></div>

CSS

#dialog{
    width: 100px;
    height: 100px;
    background-color: red;
    display: none;
}

JavaScript

$(document).ready(function(){
        $(".answer").click(function(){
            ValidateAnswerFunction(this); //sends the input element to the validate answer function
            $( "#dialog" ).css("display", "block"); // shows the dialog .hide(); to hide it!
        });
       
       $("#dialog").click(function(){
           $(this).hide();
       });
    });

   function ValidateAnswerFunction(input){
       switch($(input).val()){
           case "a":
               $("#dialog").html("correct");
               break;
           case "b":
               $("#dialog").html("close");
               break;
           case "c":
               $("#dialog").html("not even close <img src='http://www.w3schools.com/html/pic_mountain.jpg' style='width:100px;height:100px'>");
               break;
           case "d":
               $("#dialog").html("are you even trying m8?");
               break;
       }
   }