Validate form on submit

Question

I have created five input fields and a submit button to validate that fields but somehow it is not validated on submit.
In my JS I print the error dynamically. I have debugged by code and I get the proper values and errors, but it doesn't displays dynamically.

function seterror(id, error) {
  // set error
  var element = document.getElementById(id);
  debugger;
  console.log(element);
  element.getElementsByClassName('ferror')[0].innerHTML = error;
}

function validateForm(e) {
  e.preventDefault();
  var returnval = true;

  var name = document.forms['myForm']['fname'].value;
  if (name.length < 5) {
    seterror("uname", "abc");
    returnval = false;
  }

  return returnval;
}

.ferror {
  color: red;
}

<h1>Form Validation Demo</h1>
<form onsubmit="return validateForm()" name="myForm">

  Name*: <input type="text" id="uname" name="fname"><b><span class="ferror"></span></b><br> Password*: <input type="password" id="pass" name="fpass"><b><span class="ferror"></span></b><br> Confirm Password*: <input type="password" id="cpassword" name="fcpass"><b><span class="ferror"></span></b>  <br> Email*: <input type="email" id="uemail" name="femail"><b><span class="ferror"></span></b> <br> Phone*:
  <input type="phone" id="uphone" name="fphone"><b><span class="ferror"></span></b> <br>
  <input type="submit" class="btn" value="submit">

</form>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>