How to display error and not error in registration fields " separate" ( For Signup Form ) (resolved)

I am trying to display errors and not individual errors for each box
for example when one box displays an error and the other box is OK so that no error is displayed
but this code presents only errors in general

This is the code

import wixUsers from 'wix-users';
import wixLocation from 'wix-location';
import wixWindow from 'wix-window';
import wixData from 'wix-data';
let registration;

$w.onReady(function () {

 $w("#password").onKeyPress((event) => {
 let key = event.key;
  $w('#errorMessage').hide();
  $w('#emailExists').hide();
 if (key === "test") {

   console.log("Pressed Enter key on Password field"); //You can change the text of this line or delete it

 if ($w("#email").valid && $w("#password").valid && $w("#firstName").valid && $w("#lastName").valid) {
 let email = $w("#email").value;
 let password = $w("#password").value;
 let first = $w("#firstName").value;
 let last = $w("#lastName").value;

    wixUsers.register(email, password, {
      contactInfo: {
 "firstName": first,
 "lastName": last
      }
     })
     .then((result) => {
      wixLocation.to("/my-site"); //Change the URL ending to the page you want to redirect the user after they successfully register
     })
     .catch((err) => {
 let errorMsg = err;
      console.log(errorMsg);
      $w('#emailExists').show();
     });
   } else {
    console.log("Mbushni kutit"); //You can change the text of this line or delete it
    $w('#errorMessage').show();
   }
  } else {
   console.log("///"); //You can change the text of this line or delete it
  }
 });

 $w("#registrationButton").onClick((event) => {
  console.log("Button was clicked"); //You can change the text of this line or delete it
  $w('#errorMessage').hide();
  $w('#errorMessage1').hide();
  $w('#errorMessage2').hide(); //We want to hide all error messages when the person attempts to register again
  $w('#errorMessage3').hide(); //We want to hide all error messages when the person attempts to register again
 if ($w("#email").valid && $w("#password").valid && $w("#firstName").valid && $w("#lastName").valid) {
   registerPerson();
   console.log("Mbushni kutit"); //You can change the text of this line or delete it
  } else {
   $w('#errorMessage').show();
   $w('#errorMessage1').show();
   $w('#errorMessage2').show();
   $w('#errorMessage3').show(); //This is were we prompt the message to show up again ONLY if there is an error
   console.log("///"); //You can change the text of this line or delete it
  }

 });

});

function registerPerson() {

 let email = $w("#email").value;
 let password = $w("#password").value;
 let first = $w("#firstName").value;
 let last = $w("#lastName").value;

 wixUsers.register(email, password, {
   contactInfo: {
 "firstName": first,
 "lastName": last
   }
  })
  .then((result) => {
   wixLocation.to("/my-site"); //Change the URL ending to the page you want to redirect the user after they successfully register
  })
  .catch((err) => {
 let errorMsg = err;
   console.log(err);
   $w('#emailExists').show(); //This is were we prompt the message to show up again ONLY if there is an error
  });
}

 

Thank you for the help you can provide me