title: jQuery - Uncaught TypeError: Cannot read property 'length' of undefined
body: <p>I have got this JSON - address.json</p>
  
  <pre><code>{
    "province": [
      {
        "id": "1",
        "name": "province1",
        "district": [{
            "districtID": "1",
            "districtName": "district1"
          }
        ]
      }, {
        "id": "2",
        "name": "province2",
        "district": [{
            "districtID": "2",
            "districtName": "district2"
          }, {
            "districtID": "3",
            "districtName": "district3"
          }
        ]
      }
    ]
  }
  </code></pre>
  
  <p>HTML Code</p>
  
  <pre><code> &lt;label for="addressProvince"&gt;State: &lt;/label&gt;
   &lt;select id="addressProvince"&gt;&lt;/select&gt;
  </code></pre>
  
  <p>Javascript </p>
  
  <pre><code>//Province
  $(function(){
  
      $.getJSON("address.json", function(data) {
  
          console.log( "success1");
  
  
          var provinceCount = data.province.length;
          var provinceList = '&lt;option selected="selected" value="0"&gt;- select -&lt;/option&gt;';
  
          for (var i = 0; i &lt; provinceCount; i++) {
               provinceList += "&lt;option value='" + data.province[i].id + "'&gt;" + data.province[i].name + "&lt;/option&gt;";
          }
          $("#addressProvince").html(provinceList);
  
      });
  });
  
      //District  
      $('#addressProvince').on('change', function () {
  
      var provinceID = $(this).val();
  
      $.getJSON("address.json", function(data) {
  
          console.log( "success2");
  
          var provinceCount = data.province.length;
  
          for (i = 0; i &lt; provinceCount; i++) {
  
                  if(data.province[i].id == provinceID){
  
                      console.log("dis case 1 = "+ data.province[i].district.length); //***Problem case 1****
  
                      console.log("dis case 2 = "+ data[0].province[i].district.length); //***Problem case 2****
  
                      console.log("dis case 3 = "+ data[0].province[i].district[0].districtName); //***Problem case 3****
                  }
  
          }
  
      });
  
  });
  //End District
  </code></pre>
  
  <p>How to get the length of district ?
  My Console.log reporting an error</p>
  
  <p>Case 1 Report : </p>
  
  <blockquote>
    <p>Uncaught TypeError: Cannot read property 'length' of undefined</p>
  </blockquote>
  
  <p>Case 2 Report : </p>
  
  <blockquote>
    <p>Uncaught TypeError: Cannot read property 'province' of undefined</p>
  </blockquote>
  
  <p>Case 3 Report : </p>
  
  <blockquote>
    <p>Uncaught TypeError: Cannot read property 'province' of undefined</p>
  </blockquote>