如何在附加的div中使用jqueryinsertafter，而不在ajax调用中重叠？

我正在使用jQuery括号库（）。我有三个池（锦标赛括号），我想给每个池一个标题，但他们在池后面

我的Ajax调用：

var minimal0 = $('<div id="#minimal0"></div>');
var minimal1 = $('<div id="#minimal1"></div>');
var minimal2 = $('<div id="#minimal2"></div>');

var pooltitle0 = $('<div id="#pooltitle0"><h3>Pool A</h3></div>');
var pooltitle1 = $('<div id="#pooltitle1"><h3>Pool B</h3></div>');
var pooltitle2 = $('<div id="#pooltitle2"><h3>Pool C</h3></div>');

$("#gerar_grelha_inscritos_btn").on("click", function () {
    var competicao_id = $('#gerar_grelha_inscritos_btn').attr('data-id');
    var designacao = 'Pool A';
    $.ajax({
        url: "<?php echo base_url(); ?>" + "competicoes/grelha_competicao/sortear_atletas",
        data: {competicao_id: competicao_id, designacao: designacao},
        type: "POST",
        datatype: "text",
        success: function (response) {
            var atletas = response;
            $('#minimal').empty();

            $('#minimal').append(minimal0);
            minimal0.bracket({
                init: {"teams": atletas[0]}
            });

            $('#minimal').append(minimal1);
            minimal1.bracket({
                init: {"teams": atletas[1]}
            });

            $('#minimal').append(minimal2);
            minimal2.bracket({
                init: {"teams": atletas[2]}
            });

            pooltitle0.insertBefore(minimal0);
            pooltitle1.insertAfter(minimal1);
            pooltitle2.insertAfter(minimal2);
        }
    });

});

var minimal0=$（''）；
最小风险值1=$（''）；
最小风险值2=$（''）；
var pooltitle0=$（“池A”）；
var pooltitle1=$（“池B”）；
var pooltitle2=$（“池C”）；
$（“#gerar_grelha_inscritos_btn”）。在（“单击”，函数（）{
var competicao_id=$（'gerar_grelha_inscritos_btn'）.attr（'data-id'）；
var=池A；
$.ajax({
url:“+”competicoes/grelha_Competico/Sorter_atletas”，
数据：{competicao_id:competicao_id，designaco:designaco}，
类型：“POST”，
数据类型：“文本”，
成功：功能（响应）{
var atletas=响应；
$（“#最小值”）.empty（）；
$（'#minimal'）。追加（minimal0）；
最小0.0括号({
初始化：{“团队”：atletas[0]}
});
$（'#minimal'）。追加（minimal1）；
1.括号({
初始化：{“团队”：atletas[1]}
});
$（'#minimal'）。追加（minimal2）；
2.括号({
初始化：{“团队”：atletas[2]}
});
pooltitle0.insertBefore（最小值0）；
池标题1.插入者（最小值1）；
池标题2.插入后（最小值2）；
}
});
});

我的看法是：

<div id="minimal" class="demo"></div>

我的结果是：