jQuery DataTables将div附加到特定位置

Question

I have code:

<div class="addButton col-lg-6">
    <button type="button" class="btn btn-primary" data-toggle="modal">BTN</button>
</div>
<div class="table-responsive">
    <div id="PositionDataTable2_wrapper" class="dataTables_wrapper form-inline dt-bootstrap no-footer">
        <div id="PositionDataTable2_processing" class="dataTables_processing" style="display: none;">Processing...</div>
        // place where <div class="addButton"> should appear
        <div id="PositionDataTable2_filter" class="dataTables_filter"></div>
        <div class="dataTables_paginate paging_simple_numbers" id="PositionDataTable2_paginate"></div>
    </div>
</div>

I want to take first div, which has addButton class and put into div PositionDataTable2 and place it between the processing and filter parts. But append and prepend only does it inside div start or end.

Also it would be great, if someone would suggest how to place it correctly and make a copy or so that my button wouldn't disappear on datatable fndestroy and recreate.

Answer 1

您可以尝试使用$.after()插入，例如：

$(".dataTables_processing").after($(".addButton").html());

Answer 2

Jquerys insertAfter() should work. Try something like this:

$('div.addButton').insertAfter('div#PositionDataTable2_wrapper');

EDIT: If you don't want that the first addButton disappears you could use .clone()

$('div.addButton').clone().insertAfter('div#PositionDataTable2_wrapper');