Add Tooltip to Donuts

init.js

                var plot1 = $.jqplot('plotId', [data], {
                   seriesDefaults: {
                	        renderer:$.jqplot.DonutRenderer,
                	        rendererOptions:{
		                         highlightMouseDown : false, 
 		                         highlightMouseOver: true, 
                	             sliceMargin: 0,
                	             innerDiameter: 165,
                	             startAngle: -90,
                	             shadow: false
                	         }
                	    },
                    grid: {
                        drawGridlines: false,
                        backgroundColor: "#ffffff",
                        borderColor: "#ffffff",
                        borderWidth: 0,
                        shadow: false
                    },
                    seriesColors: [ "#98C73D", "#00A9E0", "#67CDDC", "#01A4A4","#D70060", "#E54028", "#F18D05", "#61AE24", "#D0D102", "#32742C",  "#616161", "#3B3B3D", "#98C73D", "#00A9E0", "#67CDDC", "#01A4A4","#D70060", "#E54028", "#F18D05", "#61AE24", "#D0D102", "#32742C",  "#616161", "#3B3B3D"],
                    legend: {
                        show: true,
                        location: 'e',
                        placement: 'outside' ,
                        renderer: $.jqplot.EnhancedLegendRenderer,
                        rendererOptions: { }
                    }
                });

                $("#plotId").bind('jqplotDataHighlight', function(ev, seriesIndex, pointIndex, data) {
              	           var total = <?php echo $total?>;
              	           var percent = 0;
              	           if(total != 0)
              	           {
              	        	 	percent = Math.round((data[1]/total)*100);
               	           }
               	           
                           var $this = $(this);
                           $this.find('.tooltip').remove();
                           $this.append($('<div class="tooltip jqplot-highlighter-tooltip" ></div>').text(data[0]+' : '+data[1]+' ('+ percent +'%)').css('opacity',1));
                       }); 

                $("#plotId").bind('jqplotDataUnhighlight', function(ev, seriesIndex, pointIndex, data) {
                           var $this = $(this);
                           $this.find('.tooltip').remove();
                });