.className() seem doesnt Work

Question

У меня есть таблица с динамически добавленными строками. Эти строки содержат выбор даты и выпадающее меню, я могу установить имя класса на но не на DatePicker и выпадающее меню с помощью .className()

var table = document.getElementById(tableID); 
var rowCount = table.rows.length; 
var row = table.insertRow(rowCount); 
row.className = "row1 part"; 

var cell1 = row.insertCell(0); 
cell1.className = "value"; 
var element1 = document.createElement("input"); 
element1.type = "text"; 
element1.name = "txtbox[]"; 
element1.className = "date-pick"; // this fails 
element1.setAttribute('value', '2013/10/04'); 
cell1.appendChild(element1); 

var cell2 = row.insertCell(1); 
var element2 = document.createElement("select"); 
element2.name = "prddrop[]"; 
element2.id = "prddrop[]"; 
element2.className = "bankopt"; //this also fails 
element2.options[element2.length] = new Option("[-- Please Choose --]", "[-- Please Choose --]"); 
var arr_items = [{ 
    "IssuingBank": " --- " 
}, { 
    "IssuingBank": " --- " 
}]; 
$(document).ready(function() { 
    for (var i = 0; i < arr_items.length; i++) { 
     element2.options[element2.length] = new Option(arr_items[i].IssuingBank, arr_items[i].IssuingBank); 
    } 
}); 
cell2.appendChild(element2); 

Пожалуйста, помогите мне с этим ... Спасибо!

Answer 1

Помните, что .appendChild() возвращает элемент.

Так что вы можете сделать:

cell1.appendChild(element1).className = "class_to_add"; 

Другим способом:

Вы можете использовать setAttribute (ПРИМЕЧАНИЕ: Это не работает на IE8 и более ранние версии, как заявлено @om в комментариях.)

var i = document.createElement('input'); 
i.setAttribute('class', 'myclass'); 
document.forms[0].appendChild(i); 

Answer 2

Это должно сработать для вас. Во всех браузерах.

var yourClass = document.createAttribute("class"); 
yourClass.value = "date-pick"; 
element1.setAttributeNode(yourClass);