title: Popover not showing on first click for dynamically generated content
body: <p>I'm trying to get a popover for my webpage. It doesn't work for me on the first click but however works fine thereafter. I realize that it gets instantiated on the first click and therefore doesn't show up. Is there a better way to instantiate it, given that I'm using id's that are generated at runtime. I have looked at similar questions but they don't seem to work for me. Here is the code I have written,</p>
  
  <pre><code>    &lt;table id="userInfo"&gt;
    &lt;thead&gt;
         &lt;tr&gt;
          &lt;th&gt;UserGroup&lt;/th&gt;
        &lt;/tr&gt;
    &lt;/thead&gt;
  
    &lt;tbody&gt;
    &lt;% @userdetails.each do |user| %&gt;
        &lt;tr&gt;
          &lt;td&gt;
            &lt;a class='user_show_more' data-placement='left' id='&lt;%= user %&gt;'&gt;[+]&lt;/a&gt;
                &lt;!-- popover table starts here --&gt;
                &lt;div id="&lt;%= user %&gt;_popover" style="display: none"&gt;
                  &lt;table&gt;
                    &lt;thead&gt;
                    &lt;tr&gt;
                      &lt;th&gt;UserNames&lt;/th&gt;
                    &lt;/tr&gt;
                    &lt;/thead&gt;
                    &lt;tbody&gt;
                    &lt;tr&gt;
                      &lt;td&gt;
                        &lt;%= user['name'] %&gt;
                      &lt;/td&gt;
                    &lt;/tr&gt;
                    &lt;/tbody&gt;
                  &lt;/table&gt;
                &lt;/div&gt;
                &lt;!-- popover ends here --&gt;
            &lt;% user['group'] %&gt;
          &lt;/td&gt;
        &lt;/tr&gt;
    &lt;% end %&gt;
    &lt;/tbody&gt;
  &lt;/table&gt;
  </code></pre>
  
  <p>And my javascript code looks like this,</p>
  
  <pre><code>    $('.user_show_more').on('click', function (e) {
          var $this = $(this)
          var popover_id = '#'+$this.attr("id");
          $(popover_id).popover({
              html : true,
              content: function() {
                  var popover = '#'+$this.attr("id")+'_popover';
                  return $(popover).html();
              }
          });
      });
  </code></pre>