javascript - Replacing Div on Submit Not Submitting Form -

i trying replace form div message working, reason it's stopped onsubmit working in form, message displayed form hasn't submit.

here form:

<div id="domsearch" class="grid_4 right" style="padding-left:20px;padding-top:30px;">     <form action='/dac' id="dac" onsubmit="return check_domain_input()" accept-charset='utf-8'>         <input name="domain" class="searchdom" value="www." onclick="this.value=''"/>         <input type="submit" class="grey-big-button-submit" id="search" name="search" value="search"/>     </form> </div> 

and here js swap div:

$("#dac").submit(function (event) { $("#domsearch").slideup("slow", function () {     $(this).replacewith(         "<div id='loading' style='float:right;'>" +             "<h2>please patient while" +             "we check availability. <img src='/images/progress.gif'/></h2>" +             "" +         "</div>");     $("#loading").delay(8000).slideup("slow", function () {         $(this).replacewith(             "<div id='results' style='float:right;'>" +                 "<h2>almost there...</h2>" +             "</div>");     }); }) event.preventdefault(); }); 

any ideas i've gone wrong?

**update* @nicael i've got working after first animation enough, issue want add third message following should make sense breaks script:

$("#dac").submit(function (event) { $("#domsearch").slideup("slow", function () { $(this).replacewith("<div id='loading' style='float:right;'>" +         "<h2>please patient while check availability. " +         "<img src='/images/progress.gif'/></h2>" +         "" +         "</div>"); $("#dac").submit();  $("#loading").delay(40000).slideup("slow", function () { $(this).replacewith("<div id='results' style='float:right;'>" +             "<h2>checking new tlds & preparing results " +             "<img src='/images/progress.gif'/></h2>" +             "</div>");    $("#results").delay(60000).slideup("slow", function () { $(this).replacewith("<div id='delay' style='float:right;'>" +             "<h2>apologies delay " +             "<img src='/images/progress.gif'/></h2>" +             "</div>");       }); })  }); 

any ideas?

you preventing form automatic submission adding

event.preventdefault(); 

in end.

in case, can manually submit form after animations completed adding

$("#dac").submit() 

to second replacewith():

$("#loading").delay(8000).slideup("slow", function () {         $(this).replacewith("<div id='results' style='float:right;'>" +             "<h2>almost there...</h2>" +             "</div>");         $("#dac").submit(); //<-- add there }); 

if want start submitting before animations, place above thing @ beginning of slideup():

$("#domsearch").slideup("slow", function () {     $("#dac").submit(); //<-- place here     ...