Selectable

HTML

<table id="test-table">
    <tr>
        <td class='file'>aaa</td>
        <td >one</td>
    </tr>
    <tr>
        <td class='file'>aaa</td>
        <td>one</td>
    </tr>
    <tr class='parnet'>
        <td>aaa</td>
        <td>one</td>
    </tr>
    <tr class='parnet'>
        <td>aaa</td>
        <td>one</td>
    </tr>
</table>

CSS

#feedback { font-size: 1.4em; }
    #selectable .ui-selecting { background: #FECA40; }
    #selectable .ui-selected { background: #F39814; color: white; }
    #selectable { list-style-type: none; margin: 0; padding: 0; width: 550px; }
    #selectable li { margin: 3px; padding: 1px; float: left; width: 100px; height: 80px; font-size: 4em; text-align: center; }

JavaScript

// Create a filter to only make <li> with the specified css class, selectable.
	var option = {
		filter: "td.file",
		cancel: ".parnet"
	};

	 $('#test-table').selectable(option);