Goal:  

Make the th of "#" and "Firstname" to have background color yellow in hover

Problem:  

I do not know how to solve it. 

Information:  

In this context I cannot use `<thead>` and `<body>` and I'm using Bootstrap and jQuery.

```css
.makeThisOpacity {
    opacity: 0;
}
.makeThisOpacity: hover {
    background-color: yellow;
}
```

```html
<html lang="en">

<head>
    <title></title>
    <link href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap-theme.css" rel="stylesheet" />
    <link href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css" rel="stylesheet" />
    <script src="https://code.jquery.com/jquery-1.11.3.min.js"></script>
    <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script>
</head>

<body>
    <br>
    <table class="table table-hover">
        <tr>
            <th class="makeThisOpacity">#</th>
            <th class="makeThisOpacity">>First Name</th>
            <th>Last Name</th>
            <th>Username</th>
        </tr>
        <tr>
            <td>1</td>
            <td>Mark</td>
            <td>Otto</td>
            <td>@mdo</td>
        </tr>
    </table>
</body>

</html>
```