JSFiddle - React, Tailwind, and code Playground
HTML
<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootswatch/2.1.1/cerulean/bootstrap.min.css">
<table id="compare_table" class="table table-bordered">
<thead>
<tr>
<th style="text-align:center" colspan="2">商品比較表</th>
</tr>
</thead>
<tbody>
<tr class="odd" data-type="title">
<td width="260">
<div id="block">
<ul id="list" class="unstyled">
<li><a href="#" class="block1 btn btn-primary" data-myid="no1">請點我,我是編號一</a></li>
<li><a href="#" class="block1 btn btn-primary" data-myid="no2">請點我,我是編號二</a></li>
<li><a href="#" class="block1 btn btn-primary" data-myid="no3">請點我,我是編號三</a></li>
<li><a href="#" class="block1 btn btn-primary" data-myid="no4">請點我,我是編號四</a></li>
<li><a href="#" class="block1 btn btn-primary" data-myid="no5">請點我,我是編號五</a></li>
<li><a href="#" class="block1 btn btn-primary" data-myid="no6">請點我,我是編號六</a></li>
<li><a href="#" class="block1 btn btn-primary" data-myid="no7">請點我,我是編號七</a></li>
<li><a href="#" class="block1 btn btn-primary" data-myid="no8">請點我,我是編號八</a></li>
</ul>
</div>
</td>
<td>
<div id="output" class="form-horizontal"></div>
</td>
</tr>
</tbody>
</table>
JavaScript
$('#block').on('click','.block1',function(){
var ret ='';
ret += '<dt> attr("data-myid") <dt>' + '<dd>' + $(this).attr("data-myid") +'<dd>'
ret += '<dt> data("myid") <dt>' + '<dd>' + $(this).data("myid") + '<dd>'
$('#output').html('<dl class="dl-horizontal">'+ ret +'</dl>');
});
for(i=1;i<=10;i++){
var listItem = $('<li />')
var linkItem = $('<a />')
linkItem.addClass('block1 btn btn-primary')
linkItem.data('myid', 'js'+ i)
linkItem.html('請點我,Javascript 產生 #:'+i)
listItem.append(linkItem)
$('#list').append(listItem)
}