Wordpress sign up all process in the same div

Hi, I'm trying to customize sign up page.
I create an overlay and show /wp-signup.php/ content in that overlay.
I want to that when user click Next button that will still in the overlay, but right now it direct to /wp-signup/ page not in the overlay.

<!-- The overlay -->
<div id="myNav" class="overlay">
 <a href="javascript:void(0)" class="closebtn" onclick="closeNav()">×</a>
   <!-- Overlay content -->
  <div class="overlay-content" id="overlay-content">
  </div>
</div>
<span id="open" onclick="openNav()">open</span>
<script>
 jQuery(document).ready(function(){

  jQuery("#open").click(function(){
      jQuery("#overlay-content").load('/wp-signup.php');
      jQuery("#header_container").hide();
  });

    jQuery("#next").click(function(){
    jQuery("#overlay-content").load( '/wp-signup.php');
     });
  });
</script>

This is my site

If this question is not in service and I won't ask again.
I'm stuck in here very long time and I don't know what to do.