Custom validation message and method

HTML

<script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.10.0/jquery.validate.min.js"></script>
<script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.10.0/additional-methods.js"></script>
<form id="my-form">
    <div>
        <span>No whitespase input:</span>
        <input type="text" name="noWhitespace" />
    </div>
    <div>
        <span>Only '7' input :)</span>
        <input type="text" name="onlySeven" />
    </div>
    <div>
        <input type="submit" />
    </div>
</form>

CSS

.error {
    color: red;
}
span {
    display: inline-block;
    width: 150px;
}
input, select {
    width: 150px;
}
.with-select > span,
.with-select > label.error {
    vertical-align: top;
    margin-top: 5px;
    display: inline-block;
}

JavaScript

// Custom validation messages
jQuery.extend(jQuery.validator.messages, {
    required: "test",
   });

    // Custom validation

// validation
$('#my-form').validate({
    rules: {
        // from file additional-methods.js
        noWhitespace: "required nowhitespace",
        // defined above
        
    }
});