在jsp页面上怎的动态添加一行带有radio样式的单选按钮

在jsp页面上怎样动态添加一行带有radio样式的单选按钮
<tr>
<td align="right"><label>材质：</label></td>
<td align="left">
<div class="button-holder">
<input type="radio" id="radio-1-1" name="radio-1-set" class="regular-radio big-radio" checked />
<label for="radio-1-1">全部</label> 
<input type="radio" id="radio-1-2"name="radio-1-set" class="regular-radio big-radio" />
<label for="radio-1-2">钢质</label> 
<input type="radio" id="radio-1-3" name="radio-1-set" class="regular-radio big-radio" />
<label for="radio-1-3">不锈钢</label>
</div>
</td>
</tr>

如何用在页面上动态添加这一块内容呢？求大神指点一二！！
------解决方案--------------------
<div id="dd"></div>

function click(){
       document.getElementById("dd").innerHTML=" 把你那段table代码加到这里";
}
------解决方案--------------------
var html="<tr>
<td align="right"><label>材质：</label></td>
<td align="left">
<div class="button-holder">
<input type="radio" id="radio-1-1" name="radio-1-set" class="regular-radio big-radio" checked />
<label for="radio-1-1">全部</label> 
<input type="radio" id="radio-1-2"name="radio-1-set" class="regular-radio big-radio" />
<label for="radio-1-2">钢质</label> 
<input type="radio" id="radio-1-3" name="radio-1-set" class="regular-radio big-radio" />
<label for="radio-1-3">不锈钢</label>
</div>
</td>
</tr>";
$(html).appendTo(table);
------解决方案--------------------

引用:

innerHTML方法添加的只是某个值而已，不能根据客户自己的需求动态添加，我的意思就是不能随意的添加值。

首先建议你使用某个javascript框架，比自己纯手工写效率高。
然后就是清楚表述你的需求。

下面代码可以操作table，插入新行。

var tableRef = document.getElementById('myTable').getElementsByTagName('tbody')[0];


// Insert a row in the table at the last row

var newRow   = tableRef.insertRow(tableRef.rows.length);


// Insert a cell in the row at index 0

var newCell  = newRow.insertCell(0);


// Append a text node to the cell

var newText  = document.createTextNode('New row')

newCell.appendChild(newText);