Change the CSS class of an input on validation error with razor

With MVC3, an input-validation-error CSS class will automatically be added to to the input elements which have validation errors.

Therefore in your CSS you can style this class:

.input-validation-error
{
   color:red;
}

By default MVC adds input-validation-error and field-validation-error, you can use JQuery to override these classes:

<script type="text/javascript">
    $(document).ready(function(){
        $('.input-validation-error').addClass('CustomErrorClass').removeClass('input-validation-error');
        $('.field-validation-error').addClass('CustomErrorClass').removeClass('field-validation-error');
    });
</script>