Problem Collapse accordion With ajax

I am trying to load the contents of a table that has information inside an Accordion collapse, but I upload the content of the accordion next to the table and not hidden as it should:

My ajax:

        // Gestión de RMA Dinámica
        $.ajax({
            type: "POST",
            url: base_url + 'index.php/welcome/getGestionRMA',
            dataType: "json",
            data:{

            },
            success:function(e){

                $(".cuerpo-tabla-rma").html(" ");

                for (var i = 0; i < e.length; i++ )
                {
                    console.log(e[i]);
                    var tr  = "<tr data-rma='" + e[i]['rmaId'] + "'>";
                    var td1 = "<td>" + e[i]['reference'] + "</td>";
                    var td2 = "<td>" + e[i]['name'] + "</td>";
                    var td3 = "<td>" + e[i]['date'].split("-").reverse().join("/") + " (" + e[i]['time'] + ")</td>";   
                    var td4 = "<td>" + e[i]['firstName'] + " " + e[i]['lastName'] + "</td>";   

                    var acciones = e[i]['action'].split(",");

                    if( (acciones.length -1) == 1)
                    {
                        var td5 = "<td><a data-toggle='collapse' data-target='#acordeon" + e[i]['rmaId'] + "' class='link-underlined link-blue accordion-toggle'>" + (acciones.length -1)  + " acción </a></td>";
                    } else {
                        var td5 = "<td><a data-toggle='collapse' data-target='#acordeon" + e[i]['rmaId'] + "' class='link-underlined link-blue accordion-toggle'>" + (acciones.length -1)  + " acciones </a></td>";

                    }
                    var td6 = "<td class='icono-rma-remove fa fa-times' data-popout='true'></td>";
                    var td7 = "<td class='icono-equipo-edit fa fa-pencil'></td>";
                    var tr2 = "</tr>";

                    var tr3 = "<tr class='hijo'>";
                    var td8 = "<td colspan='12' class='hiddenRow'>";
                    var div1 = "<div class='accordian-body collapse margin-bottom-20' id='acordeon" + e[i]['rmaId'] +"'>";

                    $(".cuerpo-tabla-rma").append(tr+td1+td2+td3+td4+td5+td6+td7+tr2);

                    $(".cuerpo-tabla-rma").append("<tr class='hijo'>");
                    $(".cuerpo-tabla-rma").append("<td colspan='12' class='hiddenRow'>");
                    $(".cuerpo-tabla-rma").append("<div class='accordian-body collapse margin-bottom-20' id='acordeon" + e[i]['rmaId'] +"'></div>");

                    for (var a = 0; a < acciones.length -1 ; a++)
                    {  

                        $(".cuerpo-tabla-rma").append("<div class='tituloSubcampoRma margin-top-20 margin-horizontal-20'>" + acciones[a] + "</div>");
                    }

                    $(".cuerpo-tabla-rma").append("</td>");
                    $(".cuerpo-tabla-rma").append("</tr>");
                }

            },
            error:function(e){

            }
        });

My accordion:

      <tr class="hijo">
         <td colspan="12" class="hiddenRow">
             <div class="accordian-body collapse margin-bottom-20" id="acordeon1">
             <div class="tituloSubcampoRma margin-top-20 margin-horizontal-20">1 - Ajuste de la propela</div>
             <div class="textoSubcampoRma margin-top-5 margin-horizontal-20">Ajuste y engrase de la propela para un mejor funcionamiento.</div>
             <div class="tituloSubcampoRma margin-top-20 margin-horizontal-20">2 - Cambio de pieza</div>
             <div class="textoSubcampoRma margin-top-5 margin-horizontal-20">Se sustituyo el brazo del rotor principal por uno nuevo. Referencia de recambio 0012345</div>
             </div>
          </td>
        </tr>

Can someone tell me where my error is?