Untitled

<!--register.html-->
    <!DOCTYPE html>
    <html>
    <head>
    <script class="jsbin" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
      <script class="jsbin" src="http://ajax.aspnetcdn.com/ajax/jquery.templates/beta1/jquery.tmpl.min.js"></script>
    <meta charset=utf-8 />
    <title>Register</title>
    <style>
      article, aside, figure, footer, header, hgroup,
      menu, nav, section { display: block; }
    </style>
    </head>
    <body>
      <form>
        <h1>Please enter data</h1>
        FirstName: <input id="firstname" type="text" placeholder="FirstName" /> <br>
        LastName : <input id="lastname" type="text" placeholder="LastName" /><br>
        Email ID : <input id="email" type="text" placeholder="Email" /><br>
        UserName : <input id="username" type="text" placeholder="UserName" /><br>
        Password : <input id="password" type="password" placeholder="Password" /><br>
        <input type="button" value="Register" onclick="insert()" />
      </form>
     <!--Login form-->
    <div id="demo" style="display:none">
    <div class="container">
    <form id="form_id" method="post" name="myform">
    <label>User Name :</label>
    <input type="text" name="username" id="username"/>
    <label>Password :</label>
    <input type="password" name="password" id="password"/>
    <input type="button" value="Login" id="submit" onclick="validate()"/>
    </form>

    </div></div>
    <br>
    <button type="button"    onclick="document.getElementById('demo').style.display='block'">Login!</button>
    <div id="display"></div>
    <script src="D:/Xperience/js/controller.js">
    </script>
    </body>
    </html>

   <!-- controller.js-->
    var users = [];
    localStorage.setItem("keyforusers", JSON.stringify(users));
    var idInput  = (users.length) +1;
    var firstnameInput   = document.getElementById("firstname");
    var lastnameInput = document.getElementById("lastname");
    var emailInput  = document.getElementById("email");
    var usernameInput   = document.getElementById("username");
    var passwordInput = document.getElementById("password");
    var messageBox  = document.getElementById("display");

    function userdetails(id, firstname, lastname, email, username, password){

    this.id= id;
    this.firstname= firstname;
    this.lastname= lastname;
    this.email= email;
    this.username= username;
    this.password=password;
    }

    function insert()
    {
        var user=new userdetails(idInput.value,firstnameInput.value, lastnameInput.value, emailInput.value, usernameInput.value, passwordInput.value);
        users.push(user);

    `enter code here`//Clear the fields
      firstnameInput.value = "";
      lastnameInput.value  =  "";
      emailInput.value = "";
      usernameInput.value = "";
      passwordInput.value = "";
    }

    function validate(){
    var username = document.getElementById("username").value;
    var password = document.getElementById("password").value;
    ulen= users.length;
    for(i=0; i < ulen; i++)
    {
    if ( username == users[i].username && password == users[i].password){
        alert("Logged in successfully");
      }
    }
    username.value = "";
    password.value = "";

    }