title: Changing the bootstrap popover position for a particular element
body: <p>I am using the <a href="http://twitter.github.io/bootstrap/javascript.html#popovers">bootstrap popover</a> on a table of data as you will see from my jsFiddle below each cell creates a popover when clicked on. </p>
  
  <p>I am trying to adjust the position or 'placement' of the popover for the last td in a row, the idea is when the last cell is clicked the popover will be positioned to the left rather than the top. </p>
  
  <p>You will see if you scroll to the end of the table click on the last cell i have implemented the selection but not the positioning. </p>
  
  <p>Any ideas on how to achieve this?</p>
  
  <p><a href="http://jsfiddle.net/N8NNC/1/">http://jsfiddle.net/N8NNC/1/</a></p>
  
  <p>Heres by javascript for the popovers:</p>
  
  <pre><code>$(".metapop").popover({ 
  
      html: true,
      trigger: 'manual',
      placement: 'top',
      title: "You clicked on this cell:",
      content: 'hello this is a popover'
  
  }).click(function(e) {
  
          $('.popover').hide();
          $(this).popover('show');
          if($(this).parent().is('td:last-child'))
              {
                  alert($(this))
              }
      });
  </code></pre>