title: Hide the Ajax thank you message, after 3 seconds and display Main Form
body: <p>I am create a Contact Us Form with jQuery Validation and jQuery Ajax submission.</p>
  
  <p>After the message is displayed via Ajax for 3 seconds the mesage should be visible to user, after that the form should re-appear.</p>
  
  <p>Here is my HTML codespec:</p>
  
  <pre><code>&lt;form id="contactForm" name="contactForm" method="post" action=""&gt;
    &lt;input type="text" placeholder="Name" id="txtName" name="name" class="required" style="color:#999;" /&gt;&lt;br /&gt;
    &lt;input type="text" name="email" id="txtEmail" placeholder="E-mail" class="required" style="color:#999;" /&gt;&lt;br /&gt;
    &lt;textarea id="textareaMessage" name="message" rows="5" cols="10" class="required" style="color:#999;"&gt;&lt;/textarea&gt;&lt;br /&gt;&lt;br /&gt;
    &lt;input class="submit" type="submit" value="Submit"/&gt;
  &lt;/form&gt;
  </code></pre>
  
  <p>Here is my jQuery Validation and jQuery Ajax submission codespec:</p>
  
  <pre><code>&lt;script&gt;
    $(document).ready(function(){
      $("#contactForm").validate({
        rules: { 
          name: "required",// simple rule, converted to {required:true} 
          email: {// compound rule 
            required: true, 
            email: true 
          }, 
          message: { 
            required: true 
          } 
        },
        submitHandler: function(form) {
          $.ajax({
            type: "POST",
            url: "send.php",
            data: $(form).serialize(),
            timeout: 3000,
            success: function() {
              $('#divContactFrm').html("&lt;div id='divSuccessMsg'&gt;&lt;/div&gt;");
              $('#divSuccessMsg').html("Thank you! Your message has been sent to us. We will be getting back to you within 24 hours.")
              .hide()
              .fadeIn(1500, function() { $('#divSuccessMsg'); });
            },
            error: function() {
              $('#divContactFrm').html("&lt;div id='divErrorMsg'&gt;&lt;/div&gt;");
              $('#divErrorMsg').html("Something is going wrong...")
              .hide()
              .fadeIn(1500, function() { $('#divErrorMsg'); });
            }
          });
          return false;
        }     
      });
    });
  &lt;/script&gt;
  </code></pre>
  
  <p>Any help will be appreciated.</p>