I am working jquery form. Where I have two forms in a page and when I submit the form one form should say please wait for the button clicked.

And other form display loading symbol instead of please wait. Please find my code in jsfiddle

Here is my reference code

$("form").submit(function() {
  if ($("email").validate().checkForm()) {
   $(this).find('input[type=submit]').prop('disabled', true);
   $(this).find('input[type=submit]').prop('value', 'Please wait...');
 } else if ($("sample_data").validate().checkForm()) {
   $(this).find('input[type=submit]').prop('disabled', true);
   $(this).find('input[type=submit]').prop();
   //How to add gif image here
 }
 });

Here is the HTML code

    <form name="email" action="#" method="post">
  <label for="email">Your Email</label>
  <input name="Email" id="email" type="email">
  <input type="button" value="submit">
</form><br /><br />
<h2>
  Testing Form
</h2>
<form name="sample_data">
  <label for="fname">First Name</label>
  <input name="fname" id="fname_id" type="text"><br />
  <label for="lname">Last Name</label>
  <input name="lname" id="lname_id" type="text">
    <input type="button" value="submit">
</form>
<div class="loadingio-spinner-spinner-cm0pdtzvpde">
  <div class="ldio-rfcqdr7w4x">
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
  </div>
</div>

Please let me know What I am doing wrong here.