Jquery表单验证错误显示Div

我对jQuery相当陌生，所以我的代码可能不是最精简的。我正在尝试编写自己的表单验证脚本，这一切都很好。

但是为了减少CSS，我想在相同的div标签中显示每个表单输入的错误消息。因此，valid_prompt的div标签放置在每个输入字段之后。

我目前遇到的问题是所有的错误消息都显示在div标签的第一次出现，这是预期的，但我需要一些方法将每个唯一的输入字段链接到显示错误的div。

表单输入示例

<input name="email1" id="email1" type="text" size="30"  maxlength="80"
value="<?php echo "$email1"; ?>" /><span id="valid_prompt"></span>
              <br/>
              <br/>
              <label><span class="reqfieldstar"> * </span>Confirm E-mail Address:</label>
                <input name="email2" id="email2" type="text" size="30"  maxlength="40" value="<?php echo "$email2"; ?>" /><span id="valid_prompt"></span>

var form = $("#SignupForm"); // Id of Form
var email = $("#email1"); // Email Address ID
var email_compare = $("#email2"); // Compare Email Address ID 
var valid_prompt = $("#valid_prompt");

var lettersReg = /^([a-zA-Z,-]|'s)*$/;
var emailReg = /^('S+@'S+('.'S+)*'.('S{2,4}))?$/i;

email.keyup(validateEmail);
email_compare.keyup(validateEmail_Compare);
firstname.keyup(validateFirstname);
surname.keyup(validateSurname);

email.blur(validateEmail);
email_compare.blur(validateEmail_Compare);
firstname.blur(validateFirstname);
surname.blur(validateSurname);


form.submit(function() {
    if (validateEmail() && validateEmail_Compare() && validateFirstname() && validateSurname()) {
        return true;
    } else {
        return false;
    }
});

function validateEmail() {
    if (email.val().length == 0) {
        email.addClass("error");
        valid_prompt.removeClass("correct");
        valid_prompt.text("You Must Enter Your E-mail Address");
        valid_prompt.removeClass("correct");
        valid_prompt.addClass("error");
        return false;
    } else {
        if (!emailReg.test(email.val())) {
            email.addClass("error");
            valid_prompt.removeClass("correct");
            valid_prompt.text("Please Enter a Valid E-mail Address");
            valid_prompt.removeClass("correct");
            valid_prompt.addClass("error");
            return false;
        } else {
            email.removeClass("error");
            valid_prompt.text("");
            valid_prompt.addClass("correct");
            valid_prompt.removeClass("error");
            return true;
        }
    }
} // Email Function End
function validateEmail_Compare() {
    if (email_compare.val().length == 0) {
        email_compare.addClass("error");
        valid_prompt.removeClass("correct");
        valid_prompt.text("You Must Confirm Your E-mail Address");
        valid_prompt.removeClass("correct");
        valid_prompt.addClass("error");
        return false;
    } else {
        if (!emailReg.test(email_compare.val())) {
            email_compare.addClass("error");
            valid_prompt.removeClass("correct");
            valid_prompt.text("Please Enter a Valid E-mail Address");
            valid_prompt.removeClass("correct");
            valid_prompt.addClass("error");
            return false;
        } else {
            if (email.val() != email_compare.val()) {
                email_compare.addClass("error");
                valid_prompt.removeClass("correct");
                valid_prompt.text("Your E-mail Addresses Do Not Match");
                valid_prompt.removeClass("correct");
                valid_prompt.addClass("error");
                return false;
            } else {
                email_compare.removeClass("error");
                valid_prompt.text("");
                valid_prompt.addClass("correct");
                valid_prompt.removeClass("error");
                return true;
            }
        }
    }
} // Email Compare Function End