JSFiddle - React, Tailwind, and code Playground

HTML

<img src="" id="form_icon" class="div_btn" height="30px" width="30px">		
<div id="nav_form_container" style="display:none">
			<div class="arrow_up"></div>
			<form id="nav_form" action="./ajax/mailer.php" method="post" class="ajax" autocomplete="off">
				<input type="text" placeholder="Your name" name="contact_name" autofocus><br>
				<input type="text" placeholder="Your Email" class="no_spacekey" name="contact_email"><br>
				<textarea maxlength="1000" placeholder="Your message" rows="6" cols="20" name="contact_msg"></textarea>
				<div class="div_btn" onclick="$('#nav_form').submit()">Send Message</div>
				<div id="nav_notification"></div>
			</form>
		</div>

CSS

#form_icon{background-color: blue}
#nav_form_container{
	display: none;
	position: fixed;
	right: 0;
	height: auto;
	min-height: 350px;
	width: 25%;
	min-width: 250px;
	background-color: blue;
}

JavaScript

document.getElementById('form_icon').onclick = function(){
   
	var el = document.getElementById('nav_form_container');
    alert(el.style.display);
	if (el.style.display != 'none'){
		el.style.display = 'none';
	}
	else {
		el.style.display = 'block';
	};
};