jquery多层级遍历数据

<script>
  var areaData = []
  var areaData = new Array();
  var districtData = []
  var districtData = new Array();
  var cityId = ''
  var organizationData = []
  var organizationData = new Array();
  var organizationRepeat = []
  var organizationRepeat = new Array();
  var organizationID = []
  var organizationID = new Array();
  //省、直辖市
  function areaRender() {
    var CaseDom = $('.area');
    let current = 1//数据总条数
    let pageSize = 100000 //每页显示的条数
    var url = `/api/v1/divisionInfo?q=page&pageNo=${current}&pageSize=${pageSize}`
    $.ajax({
      type: 'Get',
      url:url ,
      // data: pageParam,
      dataType: "json",
      success: function (response) {
        // 将数据渲染到页面
        // Dom.html('');
        areaData = response.result.data;
      }
    })
  }
  areaRender()
  //省下的市、直辖市下的区
  function districtRender() {
    var url = `/api/v1/divisionInfo?q=list`
      $.ajax({
        type: 'Get',
        url:url ,
        // data: pageParam,
        dataType: "json",
        success: function (response) {
          // 将数据渲染到页面
          // Dom.html('');
          districtData = response.result.data;
          drawingRender()
        }
      })
  }
  districtRender()
  /* 遍历展示省级 */
  function drawingRender() {
    var Dom = $('.area')
    Dom.empty()
    $.each(areaData, function(areaIndex, areaValue) {
      if (areaValue.parent_id === '') {
      //第一个默认展开
        if (areaIndex === 0){
          cityId = areaValue.record_id
          //默认展示北京的机构，右侧数据
          drawingOrganization()
          var TitleHtml = `
            <div>
              <div class="kstl" οnclick="clickNav(this)" id=${areaValue.record_id}>
                <a>${areaValue.chn_name}</a>
              </div>
              <div class="ksbd cur" id=${areaValue.record_id}>
                <ul class="area${areaValue.record_id}">
                </ul>
              </div>
            </div>
          `
        } else {
          var TitleHtml = `
            <div>
              <div class="kstl" οnclick="clickNav(this)" id=${areaValue.record_id}>
                <a>${areaValue.chn_name}</a>
              </div>
              <div class="ksbd navItem" id=${areaValue.record_id}>
                <ul class="area${areaValue.record_id}">
                </ul>
              </div>
            </div>
          `
        }
        Dom.append(TitleHtml);
        drawingDistrictRender(areaIndex,areaValue.record_id)
      }
    })
    
  }
  /* 省下的市，直辖市下的区 */
  function drawingDistrictRender (areaIndex,parentId) {
    $.each(districtData, function(districtIndex, districtValue) {
    //判断归属于那个市
      if (districtValue.parent_id ===  parentId) {
        var districtHtml = `
        <li class="district" id="${districtValue.record_id}" οnclick="clickDistrict(this)"><a>${districtValue.chn_name}</a></li>
        `
      }
        $( `.area${parentId}`).append(districtHtml);
    })
  }
  /* 点击事件，完成手风琴样式 */
  function clickNav(obj){
    $(".ksbd").addClass('navItem')
    var showEle = $(obj).next()
    /* 省、直辖市ID */
    cityId = showEle.attr('id')
    showEle.removeClass('navItem')
    showEle.addClass('cur')
    organizationRepeat = []
    drawingOrganization()
  }
  /* 点击省下面的市，直辖市的区 */
  function clickDistrict (obj) {
    var showEle = $(obj)
    cityId = showEle.attr('id')
    organizationRepeat = []
    drawingOrganization()
  }
//右侧部分，机构
  function drawingOrganization() {
    var Dom = $('.allOrganization')
    Dom.empty()
    let current = 1//数据总条数
    let pageSize = 100000 //每页显示的条数
    var url = `/api/v1/organization?q=page&pageNo=${current}&pageSize=${pageSize}&division_info_id=${cityId}`
    $.ajax({
      type: 'Get',
      url:url ,
      // data: pageParam,
      dataType: "json",
      success: function (response) {
        // 将数据渲染到页面
        // Dom.html('');
        organizationData = response.result.data;
        var a = []; // 用于接收去除重复元素后的数组 
        var organizationDispose = []
        for(var i = 0; i < organizationData.length; i++){ // 循环遍历数组
          if(jQuery.inArray(organizationData[i].division_info_id,a) < 0){ // 判断arr数组中的元素是否存在于a数组种
            a.push(organizationData[i].division_info_id); // 不存在则将该元素存放于a数组中
            //不重复的数据
            organizationDispose.push(organizationData[i])
          } else {
          	//重复的数据
            organizationRepeat.push(organizationData[i])
          }
        }
        $.each(organizationDispose, function(organizationIndex, organizationValue) {
          var DOMHtml = `
            <div class="m_title_green">${organizationValue.division_info.substring(3,organizationValue.division_info.length)}</div>
            <div class="m_ctt_green">
              <ul class="org${organizationValue.division_info_id}">
                <li>
                  <a target="_blank" href="/organization/${organizationValue.record_id}">${organizationValue.chn_name}</a>
                  <span>
                    (三甲, 特色:综合)
                  </span>
                </li>
              </ul>
              <div class="cls"></div>
            </div>
            `
          Dom.append(DOMHtml);
          drawingRepeatRender(organizationValue.division_info_id)
        })
      }
    })
  }
	//因为右侧机构数据为下图所示，可能会有重复的区，将重复区下的数据放在一个中
  function drawingRepeatRender (divisionId) {
    $.each(organizationRepeat, function(repeatIndex, repeatValue) {
      if (divisionId == repeatValue.division_info_id) {
        var repaetHtml = `
          <li>
            <a target="_blank" href="/organization/${repeatValue.record_id}">${repeatValue.chn_name}</a>
            <span>
              (三甲, 特色:综合)
            </span>
          </li>
        `
        $( `.org${repeatValue.division_info_id}`).append(repaetHtml);
      }
    })
  }
</script>

areaRender(数据

districtRender()数据