Angular Bootstrap v0.14+

Angular Bootstrap v0.14 introduced new prefixes for most previously provided controls. The original answer below still applies, but you must use the new tag names uib-tabset, uib-tab, and uib-tab-heading.

<uib-tabset>  <uib-tab>    <uib-tab-heading>      <span>hello</span><em>1</em>    </uib-tab-heading>    One  </uib-tab>  <uib-tab heading="Two">Two</uib-tab>  <uib-tab heading="Three">Three</uib-tab></uib-tabset>

Angular Bootstrap < v0.14

You should be using the tab-heading element within the tab element if you want HTML within the heading (as shown in the example in the docs):

<tabset>  <tab>    <tab-heading>      <span>hello</span><em>1</em>    </tab-heading>    One  </tab>  <tab heading="Two">Two</tab>  <tab heading="Three">Three</tab></tabset>

Updated plunker here.

Since 2016

The accepted answer is ok for the ui-bootstrap prior version 0.14.0, since version 0.14.0 (2015.10.09) tabs use uib- prefix.

See changelog

So you have to replace all tags with uib- prefix

<uib-tabset>  <uib-tab>    <uib-tab-heading>      <span>hello</span><em>1</em>    </uib-tab-heading>    One  </uib-tab>  <uib-tab heading="Two">Two</uib-tab>  <uib-tab heading="Three">Three</uib-tab></uib-tabset>

You can give your TAB tag an id and then use jQuery to augment the html.
...tab id="myid"....

and then jQuery("#myid").html("New Html")