title: Adding tooltip to legend in highcharts
body: <p>I am trying to add a tooltip to the legend in highcharts. I am using a pie chart.  Using angular js  framework.
  The legend code is as below</p>
  
  <pre><code>legend: {
    useHTML: true,
    layout: 'vertical',
    align: 'left',
    itemMarginTop: 10,
    itemMarginBottom: 15,
    title: {
      style: {
        fontSize: "14px",
        fontWeight: "600",
        color: "#404040"
      }
    },
    itemStyle: {
      fontWeight: 'normal',
      color: '#404040',
      fontSize: '14px'
    },
    //x  : 70,
    //y:  110,
    labelFormatter: function() {
  
      return ` &lt;md-icon&gt;
                    &lt;md-tooltip  md-direction="top"&gt;Hello&lt;/md-tooltip&gt;
                   &lt;i class="material-icons help_icon"&gt;info_outline&lt;/i&gt;
                  &lt;/md-icon&gt;`
    }
  
  
  
  },
  </code></pre>
  
  <p>I do not get the expected results. it just displays the letter H and no icon. If i use a standalone icon  like </p>
  
  <pre><code>&lt;i class="material-icons help_icon"&gt;info_outline&lt;/i&gt;
  </code></pre>
  
  <p>It just displays the icon. But I am unable to add any tooltip. I searched online and found a solution using the jquery UI plugin. Is there any other way without the plugin and using the angular material icons?  Please suggest.</p>
  
  <p>Ps: I have also tried with single quotes / double quotes instead of inverted ticks.</p>