JSFiddle - React, Tailwind, and code Playground

by Hitman666

HTML

<form action="#" id="gamesForm">
                    
                        <p>                                                        
                            <input id="gName" type="text" class="medium" />
                            <span class="notification information">Game name</span>                            
                        </p>

    
                            
                        <p>                            
                            <span class="notification information">Enabled:</span>
                            <input id="gEnabled" type="checkbox" />              
                        </p>
                            
                      
                        <br />
                        <!--Additional data for extra type-->
                        <div id="extraAdditionalData" class="hidden">                            
                            <p>
                                <input id="rRacers" type="text" class="medium" />
                                <span class="notification information">Racers</span>
                           </p>
                           
                           <p>

                                <input id="rVideoSet" type="text" class="medium" />
                                <span class="notification information">Video set</span>
                           </p>                                                         
                        </div>                
                </form>
                
                <a href="#" id="saveConfiguration" class="graybuttonBig">Save everything!</a>

JavaScript

$(document).ready(function(){
    $("#saveConfiguration").click(function(){
        alert( $("form").serialize() );   
    }); 
});