title: How do I use the bootstrap popover to display the content of a sibling or child element?
body: <p>I am trying to get the bootstrap popover to display contextual content based on what element is being setup with popover.</p>
  
  <p>Here's some example markup:</p>
  
  <pre><code>&lt;div class="user"&gt;
      &lt;img src="foo.jpg" /&gt;
  &lt;/div&gt;
  &lt;div class="userInfo"&gt;
      &lt;p&gt;He likes pie!&lt;/p&gt;
  &lt;/div&gt;
  
  &lt;div class="user"&gt;
      &lt;img src="bar.jpg" /&gt;
  &lt;/div&gt;
  &lt;div class="userInfo"&gt;
      &lt;p&gt;He likes cake!&lt;/p&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>The script to setup the popover:</p>
  
  <pre><code>$('.user').popover({
      trigger: 'hover',
      placement: 'top',
      html: true,
      content: //What goes here?  I want to display the contents of the userInfo class
  });
  </code></pre>
  
  <p>The expected result when I hover over the <code>user</code> class would be to show a popover displaying the content contained in the sibling or child <code>userInfo</code> class.</p>
  
  <p>My markup can be flexible; I can move the <code>userInfo</code> class to be a child, sibling, parent, etc.</p>