JSFiddle - React, Tailwind, and code Playground

HTML

<script src="ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<body>
    <div id="main">
		<div id="admin_div">		
			<h1>Admin Panel</h1>
		</div>
	</div>
</body>

CSS

#admin_div
		{
			width: 80%;
			height: 80%;
			border: 2px solid white;
			border-radius: 10px;
			background-color: #D9D9D9;
			z-index: 1;
		}
		
		h1 { margin-left: 15px; }
		
		#main
		{
			height: 100%;
			width: 100%;
			z-index: 0;
            padding: 40px;
            background: red;
		}
		
		body { background-color: black; }

JavaScript

var color = 1;
			
			$('#main').click
			(
				function(event)
				{
                    if(event.target !== this) return;
                    
                    if (color == 1)
					{
						$('body').css("background-color", "green");
						color = 2;
					} 
					else if (color == 2)
					{
						$('body').css("background-color", "black");
						color = 1;	
					}
					
				}
			);