title: Tooltip arrow doesn't appear
body: <p>I have a problem with my tooltip.
  I want my tooltip to be like this:</p>
  
  <p><img src="https://i.stack.imgur.com/VgSuR.png" alt="enter image description here"></p>
  
  <p>But my result is like this:</p>
  
  <p><img src="https://i.stack.imgur.com/DwHWC.png" alt="enter image description here"></p>
  
  <p>Below is my HTML &amp; Jquery code:</p>
  
  <pre><code> &lt;td style="padding-left:5px;padding-right:5px;" align="left" data-toggle="tooltip" data-placement="top" data-container="body" title="segment" &gt;
  
  &lt;script type="text/javascript"&gt;
      $(function () {
          $("[data-toggle='tooltip']").tooltip();
      });
  &lt;/script&gt;
  </code></pre>
  
  <p>I'm using bootstrap version 3.3.2.</p>
  
  <p>Really appreciate your help guys.</p>
  
  <p>Thank you.</p>