How can I customize my chart tooltip in jqplot?

Question

I have following chart. I need to show MM/DD as my x-axis label. In tooltip I want to show HH:y-axis data.

IE: In the following chart I want 'Oct 15','Oct 16','Oct 17' as x-axis label and as tooltip I need to show '4.00,4' '6.00,7' etc. Now my tooltip showing x-axis label itself.

var line1 = [
    ['2013-10-15 4:00', 4],
    ['2013-10-16 6:00', 7],
    ['2013-10-17 9:00', 6]
];
var plot1 = $.jqplot('firstChart', [line1], {
    title: 'Server Activity',
    seriesDefaults: {
        rendererOptions: {
            varyBarColor: true,
            barWidth: 10
        }
    },
    axesDefaults: {
        tickRenderer: $.jqplot.CanvasAxisTickRenderer,
        tickOptions: {
            fontFamily: 'Georgia',
            fontSize: '10pt',
            angle: -40
        }
    },
    axes: {
        xaxis: {
            renderer: $.jqplot.DateAxisRenderer,
            tickOptions: {
                tickOptions: {
                    mark: 'outside',
                    show: true,
                    showLabel: true,
                    formatString: '%b %d, %Y %H:00',
                    fontSize: 11
                }
            },
            tickInterval: '1 day'
        },
        yaxis: {
            min: 0,
            tickOptions: {
                mark: 'inside',
                show: true,
                showLabel: true,
                formatString: '%d',
                fontSize: 11
            }
        }
    },
    highlighter: {
        show: true,
        sizeAdjust: 7.5
    },
    cursor: {
        show: false
    }
});

Answer 1

Try the following for the tooltip

highlighter: {
                                tooltipContentEditor: function(current, serie, index, plot){
                                    var val = plot.data[serie][index];
                                    var valArr = val[0].split(" ");
                                    return valArr[1] + ', ' + val[1];
                                }
                            }

Answer 2

You can use the tooltipContentEditor option of the highlighter

tooltipContentEditor: function tooltipContentEditor(str, seriesIndex, pointIndex, plot) {
var stringToReturn = '<table class="tooltip-info"> + '<tr><td>'+ '</td></tr>'+ </table>';                                       
return stringToReturn;
}