Myujth

I have a button click function like this :

 $("#submitButton").click(function (e) 

 e.preventDefault();
 console.log("let's show my div");
 $('#mydiv').show();
 //and then doing a lot of front end operations and some ajax calls
 )

When I click the submit button, I get the console.log message immediately. But .show() method works like 7-8 seconds after that. Can you tell me how I can make .show() work immediately? Thanks.

EDIT :
My HTML code looks like this :

 <div class="main">
 <form id="myform" enctype="multipart/form-data" class="contact-forms">
 <div class="first-line">
 <div class="span3 main-row">
 <div class="input">
 <input type="text" id="id" name="id" placeholder="insert your ID" maxlength="7" oninput="this.value = this.value.replace(/[^0-9.]/g, '').replace(/(..*)./g, '$1');" />

 </div>

 </div>

 </div>

 <div class="first-line">
 <div class="span8 main-row">
 <div class="input">
 <input type="text" id="name" name="name" placeholder="Your name" />
 </div>

 </div>
 </div>
 <div id="mydiv" style="display:none">

 <label>
 Processing, please wait.
 </label>

 </div>
 </form>
 </div>

This is example of showing the div , you should hide your div with display none not hidden class , if you use hidden class just remove class to show your div

function ShowDiv()
$("#mydiv").show();

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="mydiv" style='display:none;'>Hello</div>
<button onclick="ShowDiv()"> ShowMe</button>