customSelectを行った後に、セレクトボックスの値を変更したい

下記のようにフォームとJavaSciprtを書いております。

片側のセレクトが変更されるともう片方をデフォルトに戻したいと考えているのですが
customSelect
が行われると、下記では反映されません。また、
trigger('render')
を実行するとcustomSelectの装飾が外れてしまいます。
どなたかよい方法をご存知な方がいらっしゃったらおお教えいただけませんでしょうか？

よろしくお願いします

<select class="ABSelect" id="searchA"> <option value="0">0</option> <option value="1">1</option> <option value="2">2</option> </select> <select class="ABSelect" id="searchB"> <option value="0">0</option> <option value="1">1</option> <option value="2">2</option> </select> <script> $(document).ready(function(){ $('select.ABSelect').customSelect(); }); $('#searchA').change(function() { //$('#search-B).val("0"); $('#searchB).val("0"); }); $('#searchB').change(function() { //$('#search-A).val("0"); $('#searchA).val("0"); }); </script>

行動規範の内容に同意します

回答1件

javascript
1  $('#searchA').change(function() { 
2//    $('#search-B).val("0"); 
3    $('#searchB').val("0"); 
4  }); 
5  $("#searchB").change(function() { 
6//    $('#search-A).val("0"); 
7    $('#searchA').val("0"); 
8  });