Term reference with radio buttons + bootstrap tooltip In the details of a user I have a term reference that is presented as radio buttons. You can select one radiobutton. The html looks like this:

&lt;div id="edit-field-abonnement-und" class="form-radios"&gt;
    &lt;div class="form-type-radio form-item-field-abonnement-und form-item radio"&gt;
        &lt;input type="radio" id="edit-field-abonnement-und-2" name="field_abonnement[und]" value="2" class="form-radio"&gt;  
        &lt;label for="edit-field-abonnement-und-2"&gt;Abonnement 1 &lt;/label&gt;
    &lt;/div&gt;
    &lt;div class="form-type-radio form-item-field-abonnement-und form-item radio"&gt;
        &lt;input type="radio" id="edit-field-abonnement-und-3" name="field_abonnement[und]" value="3" class="form-radio"&gt;  
        &lt;label for="edit-field-abonnement-und-3"&gt;Abonnement 2 &lt;/label&gt;

    &lt;/div&gt;
    &lt;div class="form-type-radio form-item-field-abonnement-und form-item radio"&gt;
        &lt;input type="radio" id="edit-field-abonnement-und-4" name="field_abonnement[und]" value="4" class="form-radio"&gt;  
        &lt;label for="edit-field-abonnement-und-4"&gt;Abonnement 3 &lt;/label&gt;

    &lt;/div&gt;
    &lt;div class="form-type-radio form-item-field-abonnement-und form-item radio"&gt;
        &lt;input type="radio" id="edit-field-abonnement-und-5" name="field_abonnement[und]" value="5" class="form-radio"&gt;  
        &lt;label for="edit-field-abonnement-und-5"&gt;Abonnement 4 &lt;/label&gt;
    &lt;/div&gt;
&lt;/div&gt;


But I would like to have a tooltip on each div. I can add a javascript file and send some data to the javascript and set the title with the data (I would do this with taxonomy_term_load). 

But how can I get a structure like this and make sure the tooltip works?

&lt;button type="button" class="btn btn-default" data-toggle="tooltip" data-placement="left" title="Tooltip on left"&gt;Tooltip on left&lt;/button&gt;
Part 1

You can theme a field, using theme suggestions:


  field--[type|name[--content-type]|content-type].tpl.php base template:
  
  field.tpl.php
  
  Theme hook suggestions are made based on these factors,
  listed from the most specific template to the least. Drupal will use
  the most specific template it finds:
  
  
  field--field-name--content-type.tpl.php
  field--content-type.tpl.php
  field--field-name.tpl.php field--field-type.tpl.php
  
  
  Note that underscores in a Field's machine name are replaced by hyphens. Also
  remember to include "field-" in custom field names, e.g: field--field-phone.tpl.php.


Get a copy of the base field theme from modules/field/theme/field.tpl.php and copy to your theme's folder, rename and modify as required.

Part 2

A better options is to use the Fences Module which allows for greater control over theming your fields.


  Fences is a an easy-to-use tool to specify an HTML element for each
  field. This element choice will propagate everywhere the field is
  used, such as teasers, RSS feeds and Views. You don't have to keep
  re-configuring the same HTML element over and over again every time
  you display the field.


All of the field tempaltes are in /sites/all/modules/fences/templates and correspond to the type of wrapper you have applied to your field.

Like part 1, copy the field you need into your theme's folder, rename and modify as required.