title: Get ajax result in different divs if success or error
body: <p>I currently have my jQuery outputting the result in the same div as per error or success:</p>
  
  <p>HTML</p>
  
  <pre><code>     &lt;div id="error-message").html(res);
  </code></pre>
  
  <p>JQUERY</p>
  
  <pre><code>     jQuery('#register-me').on('click',function(){
         $("#myform").hide();
         jQuery('#loadingmessage').show(); 
         var action = 'register_action';
         var username = jQuery("#st-username").val();
         var mail_id = jQuery("#st-email").val();
         var firname = jQuery("#st-fname").val();
         var lasname = jQuery("#st-lname").val();
         var passwrd = jQuery("#st-psw").val();
         var ajaxdata = {
            action: 'register_action',
            username: username,
            mail_id: mail_id,
            firname: firname,
            lasname: lasname,
            passwrd: passwrd,
         }
         jQuery.post( ajaxurl, ajaxdata, function(res){
            $('#loadingmessage').hide();
            $("#myform").show();
            jQuery("#error-message").html(res);
         });
       });
  </code></pre>
  
  <p>PHP</p>
  
  <pre><code>$error = '';
  $uname = trim( $_POST['username'] );
  $email = trim( $_POST['mail_id'] );
  $fname = trim( $_POST['firname'] );
  $lname = trim( $_POST['lasname'] );
  $pswrd = $_POST['passwrd'];
  
  if( empty( $_POST['username'] ) )
    $error .= '&lt;p class="error"&gt;Enter Username&lt;/p&gt;';
  if( empty( $_POST['mail_id'] ) )
    $error .= '&lt;p class="error"&gt;Enter Email Id&lt;/p&gt;';
  elseif( !filter_var($email, FILTER_VALIDATE_EMAIL) )
    $error .= '&lt;p class="error"&gt;Enter Valid Email&lt;/p&gt;';
  
  if( empty( $_POST['passwrd'] ) )
    $error .= '&lt;p class="error"&gt;Password should not be blank&lt;/p&gt;';
  
  if( empty( $_POST['firname'] ) )
    $error .= '&lt;p class="error"&gt;Enter First Name&lt;/p&gt;';
  elseif( !preg_match("/^[a-zA-Z'-]+$/",$fname) )
    $error .= '&lt;p class="error"&gt;Enter Valid First Name&lt;/p&gt;';
  
  if( empty( $_POST['lasname'] ) )
    $error .= '&lt;p class="error"&gt;Enter Last Name&lt;/p&gt;';
  elseif( !preg_match("/^[a-zA-Z'-]+$/",$lname) )
    $error .= '&lt;p class="error"&gt;Enter Valid Last Name&lt;/p&gt;';
  
  if( empty( $error ) ){
    $status = wp_create_user( $uname, $pswrd ,$email );
  
    if( is_wp_error($status) ){
       $msg = '';
       foreach( $status-&gt;errors as $key=&gt;$val ){
          foreach( $val as $k=&gt;$v ){
             $msg = '&lt;p class="error"&gt;'.$v.'&lt;/p&gt;';
          }
       }
       echo $msg;
    } else {
       $msg = '&lt;p class="success"&gt;Registration Successful&lt;/p&gt;';
       echo $msg;
    }
  } else {
     echo $error;
  }
    die(1);
  }
  }
  </code></pre>
  
  <p>I'm getting confused on how to get the results in 2 different places.</p>
  
  <p>1: Error = display errors and show the form, ideally errors should be displayed below each form field, at the moment is a div on top of the form</p>
  
  <p>2: Success = hide the form, display only the success msg</p>