jQuery使用Ajax更改选择框选项

Question

我有2个选择框-县和城市

城市组合根据国家组合而变化（通过Ajax）

问题是两个seletbox通过ajax在屏幕上打印，因此更改select选项根本不会运行jquery脚本...

$(document).ready(function(){
    $('*[data-type="countryID"]').on('change',function(){
        var countryID = $(this).val();
        alert (countryID);
        if (countryID != ""){
            act = "get_cities_by_countryID";
            data = "countryID=" + countryID + "&act=" + act;

            $.ajax({
                type:'POST',
                url:'ajax/cities-control.php',
                data:data,
                success:function(html){
                    $('*[data-type="cityID"]').html(html);
                    $('*[data-type="cityID"]').selectpicker('refresh');
                }
            }); 
        }
    });
});

HTML的一部分

<div class="form-group row">
    <div class="col-md-5">
        <label>Country</label>
        <select class="selectpicker" name="attraction[countryCode]" data-live-search="true" data-type="countyID">
            <option value=""></option>
            <?PHP print_seletbox ("", "countries", "alpha2_code", "country_name", "lang", $user_lang, $mainIndex['countryCode'], "", "country_name") ?>
        </select>
    </div>
    <div class="col-md-5">
        <label>City</label>
        <select class="selectpicker" name="attraction[cityID]" data-live-search="true" data-type="cityID">
            <option value=""></option>
        </select>   
    </div>
</div>