N-Level of Dynamic Loading of DropDowns using Laravel gives error on children categories

Im working to create dropdowns loading for n-level records in Laravel 5. Currently I worked with this code but Im receiving error with children categories.

Honestly I dont know how to get values from children categories and I believe that is the main source of problem. But I dont know how to solve it

CONSOLE.LOG DISPLAYS

TypeError: children is not a function[Learn More]

This is my db and code:

DB: STRUCTURE

Entity Function:

public function getAjaxGetCategoriesDropdown() {
    $categories = DB::table('categories')
        ->where('is_active', 1)
        ->orderBy('path', 'asc')
        ->select('categoryName','level','id','parentId')
        ->get();

    $first = array();
    $children = array();
    foreach ($categories as $cats) {
        if ($cats->level == 2) {
            $first[$cats->id] = $cats;
        } else if ($cats->parentId) {
            $children[$cats->parentId][] = $cats;
        }
    }
    return array('first' => $first, 'children' => $children);
}

SCRIPT:

<script type="text/javascript">
  var children = @json($cats['children'])

  function showCat(obj, level) {
      var catId = obj.value;
        level += 1;
          if ($('cat_container_' + level)) {
             $('cat_container_' + level).remove();}
             var options = children(catId);
             var html = '<select id="cat_' + catId + '" onchange="showCat(this, ' + level + ')">' + '<option value="">Select a SubCategory</option>';
         for (var i = 0; i < options.length; i++) {
            html += '<option value="' + options[i].id + '">' + options[i].categoryName + '</option>';}
            html += '</select>' + '<i class="arrow double"></i>';
            html = '<label class="field select ' + 'cat_container_' + level + '">' + html + '</label>';
$('sub_cat').insert(html);

}

VIEW BLADE:

<select id="first_cat" class="required-entry validate-select" onchange="showCat(this, 2)">
        <option value=""> Select a Category </option>
        @foreach($cats['first'] as $cat): <option value=""></option> @endforeach
</select>
<div id="sub_cat"></div>

any help appreciated!.

via Chebli Mohamed