Popover does not work when added dynamically by jquery

Question

I have a div with various information and a Popover (Bootflat).

When I add another div via jquery, the new Popover of the new div does not work. (div gets the correct formatting and Popover code is also correct)

Below, the 1st tr is already on the page, the 2nd tr is added dynamically via jQuery.

<tr id="36" class="remove-runner ">
<th scope="row">aaa bbb
    <div class="checkpoint_options_hor tooltip-demo">
        <i class="info_runner glyphicon glyphicon-info-sign" title="" data-container="body" data-html="true" data-toggle="popover" data-placement="top" data-content="<b> tyet:</b> UYT GGH<br /> <b>Esc:</b> M40<br /> <b>Estado:</b> Terminou<br /> " data-original-title="Run XPTO"></i> <i id="star_36" class="favorite_star glyphicon glyphicon-star" onclick="favoriteRunner(this, 36)" data-original-title="Add Runner fav" data-toggle="tooltip" data-placement="bottom"></i>
    </div>
</th>
<td data-title="P G">12º</td>
<td data-title="P S">13º</td>
<td data-title="P E">4º</td>                            
<td data-title="9k">1:20:55</td>
<td data-title="45k">6:56:42</td>
<td data-title="7k">14:51:59</td>
<td data-title="12k">28:57:39</td>
<td data-title="152k">39:08:31</td>
<td data-title="Meta">46:49:16</td>
<td>
    <a class="tooltip-demo">
        <i class="glyphicon glyphicon glyphicon-remove cursor_pointer" data-original-title="Remover atleta" data-toggle="tooltip" onclick="deleteDivCompare(this)" data-placement="left"></i>
    </a>
</td>

<tr id="41" class="remove-runner">
<th scope="row">UTGG Tggb
    <div class="checkpoint_options_hor tooltip-demo">
        <i class="info_runner glyphicon glyphicon-info-sign" title="" data-container="body" data-html="true" data-toggle="popover" data-placement="top" data-content="<b> yhuh:</b> <br /> <b>Esc:</b> SEsaM<br /> <b>Estado:</b> Finisher<br /> " data-original-title="Iujh YGAG"></i> <i id="star_41" class="favorite_star glyphicon glyphicon-star" onclick="favoriteRunner(this, 41)" data-original-title="Add Fav" data-toggle="tooltip" data-placement="bottom"></i>
    </div>
</th>
<td data-title="P G">12º</td>
<td data-title="P S">12º</td>
<td data-title="P E">7º</td>
<td data-title="9k">1:33:32</td>
<td data-title="4k">7:55:35</td>
<td data-title="79k">15:55:46</td>
<td data-title="125k">28:57:26</td>
<td data-title="15k">39:48:15</td>
<td data-title="Me">46:23:26</td>
<td>
    <a class="tooltip-demo">
        <i class="glyphicon glyphicon glyphicon-remove cursor_pointer" data-original-title="Remover atleta" data-toggle="tooltip" onclick="deleteDivCompare(this)" data-placement="left"></i>
    </a>
</td>

jQuery code to add the 2nd

$.ajax({
    type : 'post',
    url : 'folder/classXPTO.php',
    dataType : 'html',
    data : {
        id_xpto : id
    },
    beforeSend : function() {
    },
    complete : function() {
    },
    success : function(options) {

/* options is the code html Received by PHP */ $('. tbody'). append(options);

    },
    error : function(xhr, er) {

... } });

What can I do to make this right?