Question: I have been using the Twitter Bootstrap to build the base layout for a site. I have a need to show a table of data where each line item has a data attribute that I want to show as a pop over

such as:

```
<tr>
  <td><a href="#" class="popover-test" id ="test" rel="popover" 
            data-content="Content 1: this shows fine!" data-original-title="Title 1">Hover for popover</a>
  </td>
  <td>two</td>
  <td>three</td>
</tr>
<tr>
  <td><a href="#" class="popover-test" id ="test" rel="popover" 
            data-content="Doesn't show :(" data-original-title="Title 2">Hover for popover</a>
  </td>
  <td>two</td>
  <td>three</td>
</tr>

```

it appears though that the pop over will only work with the very first element on the list. See this jsfiddle: <http://jsfiddle.net/stycu/>

Does anyone know if this is by design or if this is a bug? I have checked the issues on github but can't see anything referring to it.

thanks in advance

Answer: 
```
$(function() {
    $("#test").popover();
});

```

You were referencing an id of `#test` on your call and ids have to be unique per element, so only the first popover was being displayed.

Use an attribute selector instead to target your `rel` popover attribute, or a class.

```
$(function() {
    $('[rel="popover"]').popover();
});

```

[Demo](http://jsfiddle.net/stycu/1/)
It may only work with gem "twitter-bootstrap-rails"

In application.js

```
$(document).ready(function() {
  options = {
    trigger : 'hover'
  }
  $('[rel="popover"]').popover(options);
});

```

In view

```
<tr>
<td><a href ="#" rel="popover" data-content="Content 1: this shows fine!" data-original-title="Title 1" >Hover for popover</a>
</td>
</tr>

<tr>
<td><a href ="#" rel="popover" data-content="Doesn't show :(" data-original-title="Title 2">Hover for popover</a>
</td>
</tr>

```

Checked it is working by putting this code on <http://jsfiddle.net/stycu/>