Jquery 下面的appned form validation消息，并在选择时删除

我正在尝试验证表单：这是我的表单：

<p id="billing_first_name_field" class="form-row form-row form-row-wide validate-required"><label class="" for="billing_first_name">Name <abbr title="required" class="required">*</abbr></label><input type="text" value="" placeholder="Enter Your Name or Nickname" id="billing_first_name" name="billing_first_name" class="input-text "></p>


<p id="billing_phone_field" class="form-row form-row form-row-last validate-required validate-phone woocommerce-invalid woocommerce-invalid-required-field"><label class="" for="billing_phone">Phone <abbr title="required" class="required">*</abbr></label><input type="tel" value="" placeholder="Enter Your Contact Number" id="billing_phone" name="billing_phone" class="input-text "><div class="notification-box error form_checkout"><i class="fa fa-exclamation-triangle"></i>Please Enter Valid Mobile Number</div></p>


$('#billing_first_name').click(function() {
    //console.log("cl")
        $('.login-right').remove('notification-box');

});
$('#billing_first_name').on('focusout', function() {
        if( validate_input($(this).val()))
    { 
        $(this).after( "<div class='notification-box error form_checkout'><i class='fa fa-exclamation-triangle'></i> Please Enter Your First Name</div>" );
    }

})

现在我的问题是，如果我点击任何一个输入，我只删除了一条当前选中的文本框消息。此外，我想tp防止表单被提交，直到验证它防止的名称，但对于一个数字的电话是地方的形式可以提交

如何删除邮件后的重复内容？ 如何删除选定的文本框消息？ 如何防止手机也提交？

.after在匹配选择器后添加元素，使添加的元素成为下一个同级元素。您需要使用。下一步以及单击事件中的输入类型元素上下文：

$(".input-text").click(function() {
  $(this).next().fadeOut('slow');
});

---

$this.find'.notification box'.fadeOut'slow'？感谢它的工作完美，只有1个问题如何防止提交，直到手机验证？这是一个WooCommerce表单，所以在放置任何数字之前，我想按照我的规则进行验证submit@DipannitaChoudhury：你可以做类似的事情。检查visible.notification box元素的长度。如果大于0，则在提交事件中返回false。

$(".input-text").click(function() {

$('.notification-box').fadeOut('slow');

$(".input-text").click(function() {
  $(this).next().fadeOut('slow');
});