Jquery form validate not showing messages

Question

can anyone tell me why this code is not showing the custom jquery messages, everything else is working fine with the validation but for some reason custom messages are not appearing when typing fx wrong email.

************Jquery***************   
<script src="//code.jquery.com/jquery-1.10.1.min.js"></script> 
<script src="//ajax.aspnetcdn.com/ajax/jquery.validate/1.9/jquery.validate.js"></script>

<script>
            $(document).ready(function() {

    $('#addCustomerForm').validate({
    rules: {
    firstName: {
    required: true

    },
            lastName: {
            required: true

            },
            email: {
                    required: true,
                    email: true

            },
            phone: {
            required: true,
                    digits: true,
                    minlength: 8
            },
            city: {
            required: true,
                    minlength: 2,
                    maxlength: 30
            },
            street: {
            required: true,
                    minlegnth: 2,
                    maxlength: 15
            },
            zipcode: {
            required: true,
                    minlength: 4,
                    maxlength: 4

            },
            country: {
            required: true,
                    minlength: 2,
                    maxlength: 10
            },
            password: {
            required: true,
                    password: true,
                    minlength: 3,
                    maxlength: 15 

            },
            messages: {
            email: {
            required: "We need customers email address to contact",
                    email: "Your email address must be in the format of name@domain.com"
            },
            city : {
            required : " City must be  filled in",
                    minlength : "At least 3 characters long",
                    maxlength : "Should not exceed 30 characters"
            }
            }


    }
    });
            $(window).load(function() {
    $('.log-out').fadeIn(200);
    });
    });

Answer 1

Your braces are out of place. You have messages as a property of the rules object. It should be at the same level as rules.

You have this:

$('#addCustomerForm').validate({
    rules: {
        firstName: { ... },
        ...
        messages: { ... }
    }
});

When you should have this:

$('#addCustomerForm').validate({
    rules: {
        firstName: { ... },
        ...
    },
    messages: { ... }
});