title: Screen reader not reading tooltip bubble message
body: <p>I am trying to get my ChromeVox screen reader to read the bubble message that pops up when the user tabs over to the tooltip icon, but it doesn't and the documentation out there is not very clear on what I thought should have been a simple solution.</p>
  
  <p>this is the code in the file I am trying to refactor to get the screen reader to read the tooltip:</p>
  
  <pre><code>&lt;div class="sub-item content-spaced"&gt;
        &lt;span class="text" tabindex="0"&gt;{{translations.taxEstLabel}}&lt;/span&gt;
        {{#hasEstimatedTax}}
          &lt;span class="value" tabindex="0"&gt;{{totalEstimatedTax}}&lt;/span&gt;
        {{/hasEstimatedTax}}
        {{^hasEstimatedTax}}
          &lt;div class="tooltip" role="tooltip" tabindex="0" data-info-text="{{translations.taxEstMessage}}"&gt;&lt;/div&gt;
        {{/hasEstimatedTax}}
      &lt;/div&gt;
  </code></pre>
  
  <p>This is a Handlebarjs template by the way.</p>