清除特定输入字段的跨度文本

Question

I have a radio button whose values are Yes and No. If I click on Yes, I need to enable 2 input fields. If I try to save them without entering values it shows validation messages. And soon after it shows validation message , if I try to click on No, then input fields must be disable and should remove validation messages.

When I click on No (value of No is 0), fields are getting disabled, but validation message remains there.

Js:

if($("input[name=is_emt_license_available]:checked").val() == 0) {
  $("#license_number").attr("disabled", "disbled");  
  $("#license_issued_body").attr("disabled", "disabled");
  $('#license_number').find('span').html('');
  $('#license_issued_body').find('span').html(''); 
} 

Html:

<input class="form-control mb-0" name="license_number" id="license_number" placeholder="ENTER LICENSE NUMBER" value="" disabled="disabled">

<span class="error" style="color:#e03b3b">Enter License Number.</span>

<input class="form-control mb-0" name="license_issued_body" id="license_issued_body" placeholder="ENTER LICENSE ISSUING BOARD" value="" disabled="disabled">

 <span class="error" style="color:#e03b3b">Enter License ISSUING BOARD.</span>

I have several other fields whose validation messages are shown inside the same span class under each element. So if I click on No, then I have to remove only the validation messages of the above two fields.

Answer 1

It is not working because the find method you are using is looking for elements which are children of the selected input element, and the span and input elements are siblings of each other.

https://api.jquery.com/find/

You can use the element + element selector to select the span element:

$('#license_number + span').html('');

In this case it will get a span that follows an element with an id of license_number

CSS element+element Selector