How to create a button into div.toolbar of multiple datatable in a single page?

ovizit

Hi ,

I am having five datatables in a single page. I have put them under a common class (myclass) and trying to create them
by the following code. However all the buttons that I am creating inside div.html is always getting overwritten by the last
button. How can I change the below code to create separate button for each table ?

 $(document).ready(function() {

    $('.myclass').each(function() {
        var table = $(this).DataTable({
            "paginate": false,
            "scrollY": "475px",
            "scrollX": "100%",
            "bSort": true,
            bFilter: true,
            bInfo: true,
            "scrollCollapse": false,
            "dom": '<"toolbar">frtip',
            "oLanguage": {
                "sSearch": "Search"
            },
        });
    });

    var dwldbtn = "title='Download table data' class='export btn btn-sm btn-success' role='button'"
    $("div.toolbar").html("<a href='" + window.location.href + "/csv'" + dwldbtn + ">Download</a>");
});

ovizit

I further modified the code as this, but it did not work too. My query.dataTables.min.js version is 1.10.6. Any help would be great.

$(document).ready(function() {

    $('.myclass').each(function() {
    var id = $(this).attr('id');
        var table = $(this).DataTable({
            "paginate": false,
            "scrollY": "475px",
            "scrollX": "100%",
            "bSort": true,
            bFilter: true,
            bInfo: true,
            "scrollCollapse": false,
            "dom": '<"toolbar">frtip',
            "oLanguage": {
                "sSearch": "Search"
            },
        });
    var dwldbtn = "id="+id +"title='Download table data' class='export btn btn-sm btn-success' role='button'"
    $("div.toolbar").html("<a href='" + window.location.href + "/csv'" + dwldbtn + ">Download</a>");
    });

});