DataTable not rendering properly on small devices

Deleu

I took a screenshot from studiopress.com/responsive of my layout to try and explain the problem:

http://puu.sh/gVfzU/b7b7af67e7.png

When on a small device, the data insertion is not rendering the first column.

Here is my code:

JS:

    elem.DataTable({'language': Nav.plugin.datatable.language});

    var base = elem.find('tbody tr:first');
    var elements = base.find('[data-name]');
    var names = elements.map(function () {
        return jQuery(this).attr('data-name');
    }).get();

    elem.dataTable().fnDeleteRow(0);

    elem.load = function (data) {
        if (!data)
            data = [];

        var rows = elem.find('tbody tr');
        rows.remove();

        for (var i = 0; i < data.length; i++) {
            var append = [];
            for (var j = 0; j < names.length; j++) {
                append[j] = data[i][names[j]];
            }

            elem.DataTable().row.add(append).draw();
        }

    };

HTML:

     <table class="table table-striped table-bordered bootstrap-datatable datatable responsive"
                               data-plugin="nav-datatable" data-service="user/account" data-method="accountList">
                            <thead>
                                <tr>                                        
                                    <th>@{page.user.account.name}</th>
                                    <th>@{page.user.account.email}</th>
                                </tr>
                            </thead>
                            <tbody>
                                <tr> 
                                    <td data-name="name"></td>
                                    <td class="center" data-name="email"></td>
                            </tbody>
                        </table>