无法控制用jQuery添加的表元素的宽度

Question

我使用JavaScript for循环通过将元素附加到表来创建16x16网格。这工作正常，除了我无法通过CSS控制盒子的宽度 - 它们总是非常狭窄。我可以设置其他方面的样式，包括高度，但更改width属性没有任何效果。我已经尝试弄乱显示，边距和填充属性，但有各种结果，但从来没有任何用处。

这是我的代码。
的的Javascript

for (var r=0; r<16; r++) {
    $('table').append("<tr></tr>");
};
for (var c=1; c<16; c++) {
    $('tr').append("<td class='grid'></td>");
};

CSS

.grid {
height: 10px; width: 10px;
border: 1px solid black;
background-color: #eeeeee;
}