JSFiddle - React, Tailwind, and code Playground
HTML
<link href="http://twitter.github.com/bootstrap/assets/css/bootstrap.css" rel="stylesheet">
<div class="container-fluid">
<div class="span9">
<table class="table table-striped" id="users">
<thead>
<tr>
<th class="header"></th>
<th class="header">Nick</th>
<th class="header">Date registered</th>
<th class="header">Type</th>
<th class="header">Locked</th>
<th class="header">Action</th>
</tr>
</thead>
<tbody>
<tr class="myRow">
<td>1</td>
<td>admin</td>
<td>2011-12-31 20:35:00</td>
<td>Admin</td>
<td>No</td>
<td>
<div class="btn-group" style="display: none">
<a class="btn dropdown-toggle" data-toggle="dropdown" href="#">Action<span class="caret"></span></a>
<ul class="dropdown-menu">
<li><a id="edit" href="#">Edit</a></li>
<li><a id="delete" href="#">Delete</a></li>
</ul>
</div>
</td>
</tr>
<tr class="myRow">
<td>
2
</td>
<td>
demo
</td>
<td>
2011-12-31 20:35:00
</td>
<td>
Normal
</td>
<td>
No
</td>
<td>
<div class="btn-group" style="display: none">
<a class="btn dropdown-toggle" data-toggle="dropdown" href="#">Action<span class="caret"></span></a>
<ul class="dropdown-menu">
<li><a id="edit" href="#">Edit</a></li>
<li><a id="delete" href="#">Delete</a></li>
</ul>
</div>
</td>
</tr>
<tr class="myRow">
<td>
3
</td>
<td>
test
</td>
<td>
2012-01-07 00:32:58
</td>
<td>
Normal
</td>
<td>
No
</td>
<td>
<div class="btn-group" style="display: none">
<a class="btn dropdown-toggle" data-toggle="dropdown" href="#">Action<span class="caret"></span></a>
<ul class="dropdown-menu">
<li><a id="edit" href="#">Edit</a></li>
<li><a...
JavaScript
jQuery('.myRow').mouseover(function() {
jQuery(this).find('div:first').show();
}).mouseout(function() {
jQuery(this).find('div:first').hide();
});