<div class="content">
            <div id="form_wrapper" class="form_wrapper">
                <form class="register active" action="regprocess.php" method = "post">
                    <h3 class="font">REGISTER</h3>
                    <div class="column">
                        <div>
                            <label for="t1">Firstname:</label>
                            <input type="text" id="t1" name="firstname" class="required" />
                            <span class="errorMessage"id="errormessage_firstname">This is an error</span>
                        </div>
                        <div>
                            <label for="t2">Username:</label>
                            <input type="text" id="t2" name="username" class="required" />
                            <span class="errorMessage"id="errormessage_username">This is an error</span>
                        </div>
                        <div>
                            <label for="t3">Email:</label>
                            <input type="text" id="t3" name="email" class="required"/>
                            <span class="errorMessage"id="errormessage_email">This is an error, please give a valid email address.</span>
                        </div>
                    </div>
                    <div class="column">
                        <div>
                            <label for="t4">Lastname:</label>
                            <input type="text" id="t4" name="lastname" class="required"/>
                            <span class="errorMessage"id="errormessage_lastname">This is an error</span>
                        </div>
                        <div>
                            <label for="p1">Password:</label>
                            <input type="password" id="p1"name ="pass" class="required" />
                            <span class="errorMessage"id="errormessage_pass">This is an error</span>
                        </div>
                        <div>
                            <label for="p1">Re-enter Password:</label>
                            <input type="password" id="p2" name="pass" class ="required"/>
                            <span class="errorMessage" id="errormessage_pass">This is an error</span>
                        </div>
                    </div>
                    <div class="bottom">
                        <div class="remember">

                        </div>
                        <input type="submit" value="Register" />
                        <a href="index.html" rel="login" class="linkform">You have an account already? Log in here</a>
                        <div class="clear"></div>
                    </div>
                </form>
                <script type="text/javascript">

                    $('form').submit(function(event){


                        var isErrorFree = true;
                        //iterate through required form elements, check if valid
                        $('input.required',this).each(function(){
                            if(validateElement.isValid(this) == false){
                                isErrorFree = false;
                            };
                        });
                    return isErrorFree;
                    });

                    var validateElement = {

                        isValid:function(element){
                            var isValid = true;
                            var $element = $(element);
                            var id = $element.attr('id');
                            var name = $element.attr('name')
                            var value = $element.val();

                            var type = $element[0].type.toLowerCase();

                            switch(type){
                                case 'text':
                                case 'password':
                                if (value.length == 0 ||
                                    value.replace(/s/g,'').length == 0){ isValid = false;}
                                    break;
                                    function emailReg2(){
                                    var emailReg = /^([w-.]+@([w-]+.)+[w-]{2,4})?$/;
                                    if(!emailReg.test(email)){
                                        isValid = false;
                                        var method =  isValid ? 'removeClass' : 'addClass';
                                    };
                                    var method =  isValid ? 'removeClass' : 'addClass';

                                    $('#errorMessage_' + name)[method]('showErrorMessage');
                                    $('label[for="' + id + '"]')[method]('error');

                                    return isValid;


                            }

                    }
                    }
                    };

                </script>

$('form').submit(function(event){
    var isErrorFree = true;
    //iterate through required form elements, check if valid
    $('input.required',this).each(function(){
        if(validateElement.isValid(this) == false){
          isErrorFree = false;
          return false;
        };
    });
    return isErrorFree;
});