2. <div class="form__item-container editor-wrapper listbox multi-selector label-inline column-two">
3.       <div class="editor-label"><label for="JobTypeIds">Job type</label></div><div class="editor-field listbox"><select id="JobTypeIds" multiple="multiple" name="JobTypeIds" style="display: none;">
4.       <option value="6509063">Perm</option>
5.       <option value="8249162">Temp Shift</option>
6.       <option value="8249163">Temp Regular</option>
7.       <option value="8249164">Contract</option>
8.       <option value="8252230">Exec Assignment</option>
9.       <option value="8252232">Interim Assignment</option>
10. </select>
11. <div class="multi-select-control active">Job type</div>
12. <div class="multi-select-options" style="display: none;">
13. <label class="option"><input type="checkbox" value="6509063" class="checkbox">Perm</label>
14. <label class="option"><input type="checkbox" value="8249162" class="checkbox">Temp Shift</label><label class="option"><input type="checkbox" value="8249163" class="checkbox">Temp Regular</label>
15. <label class="option"><input type="checkbox" value="8249164" class="checkbox">Contract</label>
16. <label class="option"><input type="checkbox" value="8252230" class="checkbox">Exec Assignment</label>
17. <label class="option"><input type="checkbox" value="8252232" class="checkbox">Interim Assignment</label>
18. </div>
19. </div>
20. </div>  

2. $('.bh-ajax-search-wrapper').each(function () {
3.         var $wrapper = $(this);
4.         var $form = $wrapper.find('.bh-ajax-search-form');
5.         var $results = $wrapper.find('.bh-ajax-search-results');
6.         var url = $wrapper.data('action');
7. 
   
9.       $form.find(':select').change(function () {
10.             alert("List box has changed");
11.             var data = $form.serialize();
12.             $wrapper.trigger('bhajaxsearchrefresh', data);
13.             return false;
14.         });
15. });

But when I select a tick box in my select list it doesn't call my script, what am I doing wrong here?