Javascript AJAX请求的完整功能未按预期运行

我正在从事一个jquery/ajax项目。在document ready上，我有以下代码：

 $(document).ready(function () {    
    $.ajax({
        url: '/Main/ReturnGroups/',
        dataType: "json",
        success: function (data) {
            $('.column').each(function (index) {
                let indexVar = index;
                let colID = $(this).attr("id");
                for (let i = 0; i < data.length; i++) {
                    if ($(this).attr("id") == data[i].ColumnID) {
                        let thisID = $(this).attr("id");
                        let thisGroupID = data[i].ID;
                        $.ajax({
                            url: '/Main/GetFullGroup/',
                            data: { groupID: thisGroupID },
                            success: function (html) {
                                $('#' + thisID).append(html);  //this html inserts a portlet (JqueryUI) based element
                            }                               
                        });
                    }                         
                }
            })              
        },
        complete: function () {
            alert($('.portlet').length); //returns 0 (leads me to believe its being run before success function
            AddPageProperties(); //this function is supposed to add a bunch of classes to the elements injected in the success function but doesnt actually add the classes when its here
        }
    });
})

$（文档）.ready（函数（）{
$.ajax({
url:“/Main/ReturnGroups/”，
数据类型：“json”，
成功：功能（数据）{
$（'.column'）。每个（函数（索引）{
设indexVar=指数；
让colID=$（this.attr（“id”）；
for（设i=0；i

在我看来，complete:函数的内容与success函数是异步运行的。根据我的理解，complete函数的目的是在ajax成功（或错误）函数完成后运行

代码迭代所有列并返回数据库中具有相同列id的所有组，然后将groupID传递给另一个webmethod，该webmethod随后查询所有任务并使用传入的groupID仅提取与该组关联的任务，然后使用该数据注入部分视图以放置tasks/集团在其各自的位置

我尝试过的事情：

-将AddPageProperties（）函数放入一个按钮单击中，在ajax完成后，单击该按钮。这完全符合预期

-使用ajaxStop（）。虽然这确实可以满足文档准备的需要，但一旦我提交另一个ajax请求，它就会再次运行该函数，从而复制代码。当元素在屏幕上移动时，我的项目使用ajax请求，因此这不起作用

-尝试获取元素的详细信息，查看在运行complete:function（）时html是否在第一个位置。代码段中的警报返回0，这使我相信在执行该警报时html不在那里

-使用每个函数的索引来确定迭代的结束，然后运行该函数，但再次不在函数中应用类。我尝试再次发出警报，查看元素是否存在，但它们不存在

-将async设置为false，但浏览器只是说它已被弃用，并且它不会更改任何行为

我的目标是，一旦所有的HTML都被注入，然后并且只有在注入之后才运行这个函数，直到稍后某个时候页面被重新加载，再也不会运行这个函数

---

我希望坚持使用JQuery/ajax，因为我的项目依赖于JQuery进行引导。

请为代码添加工作提琴是的，

complete

等待

成功

完成，但不等待在成功函数中启动的其他ajax调用。请参阅