JSFiddle - React, Tailwind, and code Playground

HTML

<div class="form1">
    <P>
    <LABEL for="firstname">First name: </LABEL>
              <INPUT type="text" id="firstname"><BR>
    <INPUT id="send" type="submit" value="Send"> <INPUT type="reset">
    </P>
 </div>

<div class="form2">
    <P>
    <LABEL for="firstname">First name: </LABEL>
              <INPUT type="text" id="firstname"><BR>
    <INPUT id="send2" type="submit" value="Send"> <INPUT type="reset">
    </P>
 </div>

CSS

.form2 {display: none;}

JavaScript

$("#send").click(function(){
    $(".form1").hide(1000,function(){
        $(".form2")).css("display", "block");
    });
  });