How to clear a field using jquery after Ajax form reload I have a custom module with a custom form with two fields: field A (select), field B (datepicker). When the user picks field B, it launches an Ajax call to validate field B. All works well so far, except for one issue: if user decides to change field A after the Ajax call, it should clear field B. 

My problem is I can't get jQuery to detect that field A was changed after the Ajax is called. I can see field A's id changes from 'foo' to 'foo--2' and I've tried the below code with both '#foo' and '#foo--2' but neither works. jQuery works only the first time the form displays, but not after ajax fires. IOW the user can change field A's selection but jQuery doesn't detect that change, I can't even get the alert to trigger. Any ideas what I might be doing wrong here?

$('#foo--2').change(function(){
    alert ('change detected');
    'input#bar-datepicker-popup-1'.val('');
});
Try this, it should work. Instead of $(document).on you can also use any outer static element.

$(document).on('change', '#foo--2', function(){
    alert ('change detected');
    'input#bar-datepicker-popup-1'.val('');
});