Master details in ASP.NET core 3

I defined this view for the master section

<table class="table">
    <colgroup>
        <col style="width:20px;" />
        <col style="width:15%;" />
        <col />
        <col style="width:15%;" />
        <col style="width:15%;" />
        <col style="width:11%;" />
    </colgroup>
    <thead>
        <tr class="text-right">
            <th>
                 
            </th>
            <th>
                @Html.DisplayNameFor(model => model.SerialNumber)
            </th>
            <th>
                @Html.DisplayNameFor(model => model.DocumentName)
            </th>
            <th>
                @Html.DisplayNameFor(model => model.UnitName)
            </th>
            <th>
                @Html.DisplayNameFor(model => model.FormatedDate)
            </th>
            <th>
                @Html.DisplayNameFor(model => model.StatusName)
            </th>
            @*<th></th>*@
        </tr>
    </thead>
    <tbody>
        @foreach (var item in Model)
        {
            <tr>
                <td>
                    <a href="#" data-id="@item.DocumentInfoId" name="document-details">
                        class="fa fa-plus-square">
                    </a>
                </td>
                <td>
                    @Html.DisplayFor(modelItem => item.SerialNumber)
                </td>
                <td>
                    @Html.DisplayFor(modelItem => item.DocumentName)
                </td>
                <td>
                    @Html.DisplayFor(modelItem => item.UnitName)
                </td>
                <td>
                    @Html.DisplayFor(modelItem => item.FormatedDate)
                </td>
                <td>
                    @Html.DisplayFor(modelItem => item.StatusName)
                </td>
            </tr>
            <tr>
                <td colspan="6">
                    <div id="div-@item.DocumentInfoId">
                    </div>
                </td>
            </tr>
         }
    </tbody>
</table>

Then in JavaScript I wrote this code for details

   $('a[name="document-details"]').click(function (event) {
        event.preventDefault();
        var documentInfoId = $(event.currentTarget).data('id');
        if ($('#icon-' + documentInfoId).hasClass('fa-plus-square')) {
            showRows(documentInfoId);
        } else {
            hideRows(documentInfoId);
        }
    });

    function showRows(documentInfoId) {
        $.ajax({
            type: 'POST',
            url: '/Documents/DocumentGroup',
            data: { documentInfoId: documentInfoId },
            dataType: 'json',
            success: function (result) {
                //var template =
                //    '<a href="Documents/Create?documentInfoId=' + documentInfoId + '" class="btn btn-primary ml-2 mb-1">جدید</a>' 
                if (result.length > 0) {
                  var template =
                        '<table class="documents w-50">' +
                        '<colgroup>' +
                        '<col style="width:auto;" />' +
                        '<col style="width:auto;" />' +
                        '<col style="width:auto;" />' +
                        '<col style="width:auto;" />' +
                        '<col style="width:auto;" />' +
                        '<col style="width:auto;" />' +                      
                        '</colgroup>' +
                        '<thead>' +
                        '<tr>' +
                        '<th>شماره سند</th>' +
                        '<th>نام سند</th>' +  
                        '<th>نام واحد</th>' + 
                        '<th>تاریخ آخرین نسخه </th>' +
                        '<th>وضعیت</th>' +
                        '<th></th>' +
                        '</tr>' +
                        '</thead>' +
                        '<tbody>';
                    for (var i = 0; i < result.length; i++) {
                        var item = result[i];                            
                        template += '<tr>' +
                            '<td>' + item.serialNumber + '</td>' +
                            '<td>' + item.documentName + '</td>' +
                            '<td>' + item.unitName + '</td>' +
                            '<td>' + item.formatedDate + '</td>' +
                            '<td>' + item.statusName + '</td>' +
                            '<td>' +
                            '<a href="/Documents/Edit?documentInfoId=' + item.documentInfoId + '" class="fa fa-edit mx-1"></a>' +
                            '<a href="/Documents/Delete?documentInfoId=' + item.documentInfoId + ' " class="fa fa-trash mx-1"></a>' +
                            '</td>' +
                            '</tr>';
                    }
                    template += '</tbody>' +
                        '</table>';
                }

                $('#div-' + documentInfoId).append(template);
                $('#icon-' + documentInfoId).removeClass('fa-plus-square').addClass('fa-minus-square');
            },
            error(ex) {
                debugger;
            }
        });
    }

function hideRows(documentInfoId) {
        $('#div-' + documentInfoId).children().remove();
        $('#icon-' + documentInfoId).removeClass('fa-minus-square').addClass('fa-plus-square');
    }
});

Details are not displayed when I click on fa-plus-square

public async Task<IActionResult> DocumentGroup(int? id)
{
    try
    {
        if (id == null)
        {
            throw new ArgumentNullException(nameof(id), "مقدار شناسه نمی تواند  تهی باشد.");
        }
        var documentInfo = await _context.DocumentsInfo
            .FirstOrDefaultAsync(di => di.DocumentInfoId == id);
        if (documentInfo == null)
        {
            return NotFound(new { Message = "سند مورد نظر یافت نشد." });
        }

        var documentGroup = await _context.DocumentsInfo
            .Include(s => s.DocumentStatus)
            .Where(dg => dg.UnitCode == documentInfo.UnitCode && dg.SerialNo == documentInfo.SerialNo && dg.DocumentTypeId == documentInfo.DocumentTypeId)
            .OrderByDescending(x => x.Revision)
            .Select(e => new DocumentRevisionModel
            {
                Id = e.DocumentInfoId,
                DocumentName = e.DocumentName,
                DocumentTypeId = e.DocumentTypeId,
                UnitCode = e.UnitCode,
                SerialNo = e.SerialNo,
                Revision = e.Revision,
                FormatedDate = e.ExecutionDate.ToString("yyyy-MM-dd", CultureInfo.InvariantCulture),
                StatusName = e.DocumentStatus.StatusName
            })
            .ToListAsync();

        var unitList = _context.Units.ToList();
        foreach (var item in documentGroup)
        {
            item.UnitName = unitList.Find(un => un.Code == item.UnitCode).Name;
        }

        return Json(documentGroup);
    }

    catch (Exception ex)
    {
        _logger.LogError(ex, "خطای فراخوانی متد DocumentGroup");
        return BadRequest(new { Message = "خطای غیر منتظره" });
    }
}