JavaScript checkbox.classList.add("flat","pull-left"); not showing the css decoration in DataTable

Question

I'm using DataTable and I creating dynamically HTML elements inside the columns. I try to add CSS class to the checkbox.

 var ttbody = document.getElementById("ttbody");
        var tr = document.createElement('tr');
        for(var i=0;i<10;i++) {
            var td = document.createElement('td');
            if(i==0) {
                 var newCheckbox = document.createElement("input");
                     newCheckbox.type = "checkbox";
                     newCheckbox.id = "chk_"+i++;
                     newCheckbox.classList.add("flat","pull-left");
                      
                    
                 td.appendChild(newCheckbox);
            }
            else {
                td.appendChild(document.createTextNode('Test'));
            }

            tr.appendChild(td)
        }
        ttbody.appendChild(tr);

I am using Bootstrap 3 CSS, but the "flat" doesn't take effect and all I see is a simple checkbox. In the same page, I have a hardcoded checkbox with the "flat" CSS and it rendered just fine.

I'm using iCheck component; could this be the reason?