Как подключить файл json к множеству раскрывающихся списков зависимостей

Question

здесь я добавляю html JQ и json коды, но код не работает. Можете ли вы помочь мне решить эту ошибку? Я сохраняю файл json также в той же папке, что и файл php. я получил этот код из онлайн. здесь кодовая ссылка https://www.webslesson.info/2017/05/json-dynamic-dependent-select-box-using-jquery-and-ajax.html html код

<select name="country" id="country" class="form-control input-lg">
    <option value="">Select country</option>
</select>
<br />
<select name="state" id="state" class="form-control input-lg">
    <option value="">Select state</option>
</select>
<br />
<select name="city" id="city" class="form-control input-lg">
    <option value="">Select city</option>
</select>

Код JQ

<script>
$(document).ready(function() {

    load_json_data('country');

    function load_json_data(id, parent_id) {
        var html_code = '';
        $.getJSON('country_state_city.json', function(data) {

            html_code += '<option value="">Select ' + id + '</option>';
            $.each(data, function(key, value) {
                if (id == 'country') {
                    if (value.parent_id == '0') {
                        html_code += '<option value="' + value.id + '">' + value.name + '</option>';
                    }
                } else {
                    if (value.parent_id == parent_id) {
                        html_code += '<option value="' + value.id + '">' + value.name + '</option>';
                    }
                }
            });
            $('#' + id).html(html_code);
        });

    }
});
</script>

JSON файл

[
   {
      "id":"1",
      "name":"USA",
      "parent_id":"0"
   },
   {
      "id":"2",
      "name":"Canada",
      "parent_id":"0"
   },
   {
      "id":"3",
      "name":"Australia",
      "parent_id":"0"
   },
   {
      "id":"4",
      "name":"New York",
      "parent_id":"1"
   },
   {
      "id":"5",
      "name":"Alabama",
      "parent_id":"1"
   }
]