title: How to call .hoverIntent on a element generated in javascript
body: <p>In my .js script I add a div that will hold a slickgrid, then I add other elements inside the grid, all when my js script loads. </p>
  
  <pre><code>var container = $('#container');
  container.html('&lt;div id="gridView"&gt;&lt;/div&gt;');
  </code></pre>
  
  <p>then I want to add the hoverIntent library functionality to it so that a popover, triggered on hovering over a element, doesn't pop up unless I hold the hover for a little while (slower then instant)</p>
  
  <p>My popover looks like this (it's inside a font awesome tag that's inside a slickgrid cell), so when I hover over this font awesome tag the popover appears. I want to use hoverIntent on it.</p>
  
  <pre><code>&lt;div class="slick-cell l0 r0"&gt;&lt;i class="fa fa-plus-circle" id="21657" data-placement="right" data-trigger="hover" onmouseover="tp.manageRollups.showCustomerIdList(21657);"&gt;&lt;/i&gt; 21657&lt;/div&gt;
  </code></pre>
  
  <p>I'm assuming I have to call something like</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>$('#gridView').on('hoverIntent', 'i.fa.fa-plus-circle')</code></pre>
  </div>
  </div>
  </p>
  
  <p>but I'm not sure! Any help would be appreciated. </p>