JQuery/Ajax: Correct way to write function?

Basic Question,

i have a function like this:

<script language="javascript" type="text/javascript">  
$(function(){
  $("select#kum_data").change(  
  function(){
    $.getJSON("getdata.jsp",{kum_data: $(this).val(), ajax: 'true1'}, 
    function(j){
      var options1 = '';
      for (var i = 0; i < j.length; i++) {
        options1 += '<option value="' + j[i].optionValue + '">' + j[i].optionDisplay + '</option>';
      }
      $("select#kategori").html(options1);
    })
  })
  
  $("select#kategori").change(  
  function(){
    $.getJSON("getdata.jsp",{kategori_data: $(this).val(), ajax: 'true2'}, 
    function(k){
      var options2 = '';
      for (var o = 0; o < k.length; o++) {
        options2 += '<option value="' + k[o].optionValue + '">' + k[o].optionDisplay + '</option>';
      }
      $("select#pekara").html(options2);
    })
  })
  
  $("select#pekara").change(  
  function(){
    $.getJSON("getdata.jsp",{isu_data: $(this).val(), kategori_data: $("select#kategori").val(),  ajax: 'true3'}, 
    function(l){
      var options3 = '';
      for (var p = 0; p < l.length; p++) {
        options3 += '<option value="' + l[p].optionValue + '">' + l[p].optionDisplay + '</option>';
      }
      $("select#data").html(options3);
    })
  }) 
})
</script>

Select allOpen in new window

Its able to work and get and submit data without problem, question is inside my jdev i saw different color(red) on < k.length; o++) { onward, i feel something is wrong with the code.

Anyone could tell me what is the correct way to correct code above so that i dont get red color?

check Screenshot for more detail:
 
Thank you.