I'm trying to add validation to the form I made

<fieldset>
    <legend>ENTER YOUR INFORMATION HERE FOR DELIVERY</legend>
    <form action="" name="deliveryform">

          Name* :<input type="text" name="name" id="name">

          Phone Number* : <input type="text" name="phonenumber" id="phonenumber">
          <span id="warning1"></span>

          Address* : <textarea name="address" id="address" required></textarea>

          Email* : <input type="text" name="email" id="email">
          <span id="warning2"></span>

          <input type="submit" id="submitbutton" value="Submit" onsubmit=" return validation()">
                    </form>
</fieldset>

Javascript

function validation()
{
    var name = document.getElementsByName("name").value;
    var phonenumber =document.getElementsByName("phonenumber").value;
    var email = document.getElementById("email").value;
    var emailformat = "[a-z0-9._%+-]+@[a-z0-9.-]+\.[a-z]{2,}$";

    if(name == ""|| null)
    {
        alert("Please Enter Your Name!");
        return false;
    }

    if(isNaN (phonenumber))
    {
        document.getElementById("warning1").innerHTML ="Enter numbers only";
        return false;
    }

    if(!email.match(emailformat))
    {
        document.getElementById("warning2").innerHTML="Please enter the correct format. Example : Abc1234@gmail.com"
        return false;
    }

    else
    {
        alert("Submitted Successfully")
    }
}

Nothing changed except ''Error Loading Page '' message appeared. Did I miss something?

I thought coding in without and with Jquery in HTML is the same thing..