Is there a way to separate the label and select options in the lengthMenu?

jsmoorejr

I am running into a problem with CSS for the lengthMenu. What seems to be causing me issues is the Dom structure of the lengthMenu itself. I have customized the "lengthMenu" to be "Items Per Page" and then the select box with custom numbers. What I see when I inspect the HTML is the select tag is inside of the label tag.

JavaScript Code:

$('#tnf-approved-decorators-table').DataTable({
    "pagingType": "simple_numbers",
    "language": {
        "lengthMenu":
            '<span class="fa fa-list-ol fa-dark-gray md-pull-left fa-1-5x hidden-no-xs"></span>Items Per Page' +
            '<div class="select-style"><select id="number-to-display-select" class="per-page">' +
            '<option value="15">15</option>' +
            '<option value="50">50</option>' +
            '<option value="100">100</option>' +
            '<option value="250">250</option>' +
            '</select></div>'
    },
    "pageLength": 15,
    "order": [ 0, 'asc' ],
    "dom": '<<"address-pagination-controls clearfix"<"pagination col-md-8 col-xs-8 text-center-xs hidden-xs"p><"clearfix parent-option xs-option-left option-right"l>>t<"address-pagination-controls clearfix"<"pagination col-md-8 col-xs-8 text-center-xs hidden-xs"p><"col-md-4 col-xs-6 clearfix parent-option xs-option-left option-right"l>>>'
});

HTML Output:

<label class="alt-label xs-full-width">
    <span class="fa fa-list-ol fa-dark-gray md-pull-left fa-1-5x hidden-no-xs"></span>Items Per Page
    <div class="select-style">
        <select id=""number-to-display-select" class="per-page">
            <option value="15">15</option>
            <option value="50">50</option>
            <option value="100">100</option>
            <option value="250">250</option>
        </select>
    </div>
</label>

I would like to pull the DIV and SELECT tag out of the LABEL tag. Is there a way to do that using the "lengthMenu" or "dom" option? Or another way?