JSFiddle - React, Tailwind, and code Playground

HTML

<input type="button" id="addmoresg" value="Add More" name="button">
<div id="addsg" style="display:none">
    <form action="sginsert()" method="post" >
        <table class="childdetailstable">
            <tr>
                <td colspan="2"><label id="sgmsg"></label></td>
            </tr>
            <tr>
                <td >First name </td>
                <td ><input name="sgfname" type="text" id="sgfname" /></td>
            </tr>
            <tr>
                <td>Middle Name </td>
                <td><input name="sgmname" type="text" id="sgmname" /></td>
            </tr>
            <tr>
                <td>Last Name </td>
                <td><input name="sglname" type="text" id="sglname" /></td>
            </tr>
            <tr>
                <td>Gender</td>
                <td><label>
                    <input type="radio" id="sgradio" name="sggender" value="male" />
                    Male</label>
                    <label>
                        <input type="radio" id="sgradio" name="sggender" value="female" />
                        Female</label></td>
            </tr>
            <tr>
                <td>SSnumber</td>
                <td><input name="sgssnum" type="text" id="sgssnum" /></td>
            </tr>
            <tr>
                <td>Relationship</td>
                <td><input name="sgrelationship" type="text" id="sgrelationship" /></td>
            </tr>
            <tr>
                <td>Emp Phn </td>
                <td><input name="sgempphn" type="text" id="sgempphn" /></td>
            </tr>
            <tr>
                <td>Emp Address </td>
                <td><input name="sgempaddr" type="text" id="sgempaddr" /></td>
            </tr>
        </table>
    </form></div>

JavaScript

$(document).ready(function() {
    $('.addmoresg').click(function() {
        $('.addsg').show("slow");
    });
});