Untitled

<!DOCTYPE html>
<html>
<head>
	<title></title>
<style type="text/css">
	body{

		font-family: helvetica, sans-serif;
		font-size: 20px;
	}

	input{

		padding: 5px, 5px, 15px, 5px;
		font-size: 30px;
		border-radius: 5px;
		width: 300px;
		border: 1px solid grey;

	}

	#wrap{

		width:  600px;
		margin: 0 auto;

	}

	label{

		position: relative;
		float: left;
		width: 200px;
		top: 15px;

	}

	.ele{

		margin:10px;
	}

	#log{
		width: 100px;
		margin-left: 150px;

	}

</style>
</head>
<body>
	<DIV id="wrap">
		<div id="#result"></div>
		<DIV class="ele">

			<label>Email</label>
			<input type="text" name="email" id="email" placeholder="eg.youremal.gmail.com">

		</DIV>

		<div class="ele">

			<label>Telephone</label>
			<input type="text" name="num" id="num" placeholder="09123456789">

		</DIV>
		<DIV class="ele">

			<label>Password</label>
			<input type="text" name="pass" id="pass" placeholder="Password">

		</DIV>

		<div class="ele">

			<label>Confirm Password</label>
			<input type="text" name="2pas" id="2pas" placeholder="Password">

		</DIV>

		<div class="ele">

			<input type="submit"  id="log" value="submit">

		</DIV>

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

	        function isEmail(email) {

				var regex = /^([a-zA-Z0-9_.+-])+\@(([a-zA-Z0-9-])+\.)+([a-zA-Z0-9]{2,4})+$/;

				return regex.test(email);
			}
	        $("#log").click(function() {
	        	var result = "";
	        	var missing ="";

	        	if ($("#email").val() == "") {
	        		missing += "<br>email";
	        	}

	        	if ($("#num").val() == "") {
	        		missing += "<br>Telephone";
	        	}

	        	if ($("#pass").val() == "") {
	        		missing += "<br>Password";
	        	}

	        	if ($("#2pas").val() == "") {
	        		missing += "<br>Confirm Password";
	        	}

	        	if (missing != "") {
	        		result += "the fallowing fields is missing" + missing ;
	        	}

	        	if (isEmail($("#email").val()) == false) {
	        		result += "<p>youremail is not valid</p>";
	        	}

	        	if ($.isNumeric($("#num").val()) ==false) {
	        		result += "<p>your nuumber is Numeric</p>"
	        	}

	        	if ($("#pass").val() != $("#2pas").val()) {
	        		result += "<p>your Password is now valid</p>"
	        	}
	         	if (result !="") {
	         		$("#result").html(result):
	         	}
	        });
	</script>
</body>
</html>