How to contain category data in tooltip

I've seen tutorials and posts about getting data from the x axis into the tooltip but I am overriding it with categories and cannot figure out how to get the x axis to show up in the tooltip.

This is what im working with:

function showTooltip(x, y, contents) {
        $('<div id="tooltip" class="flot-tooltip tooltip"><div class="tooltip-arrow"></div>' + contents + '</div>').css({
            top: y - 43,
            left: x - 15,
        }).appendTo("body").fadeIn(200);
    }      

   var data = [[1492854610, -1240],[1492939020, -1273],[1493025073, -1279],[1493117066, -1186],[1493198484, -1269],[1493289175, -1198],[1493370646, -1280],[1493458518, -1255],[1493543731, -1275],[1493630250, -1273],[1493716306, -1279],[1493803609, -1264],[1493889258, -1276],[1493975557, -1278],[1494064529, -1235],[1494155440, -1160],[1494237980, -1224],[1494321047, -1280],[1494407990, -1271],[1494494125, -1275],[1494581609, -1257],[1494668321, -1252],[1494753220, -1277],[1494847855, -1140],[1494925963, -1278],[1495012537, -1275],[1495099289, -1269],[1495188205, -1227],[1495273568, -1244],[1495358329, -1272]];

    $.plot($("#placeholder"), [{
        label: "Delay: ",
        data: data,
        color: "#3a8ce5"
    }], {
        xaxis: {
        mode: "categories",
        tickLength: 0,
        ticks: [[0, "1:50 AM"],[1, "1:17 AM"],[2, "1:11 AM"],[3, "2:44 AM"],[4, "1:21 AM"],[5, "2:32 AM"],[6, "1:10 AM"],[7, "1:35 AM"],[8, "1:15 AM"],[9, "1:17 AM"],[10, "1:11 AM"],[11, "1:26 AM"],[12, "1:14 AM"],[13, "1:12 AM"],[14, "1:55 AM"],[15, "3:10 AM"],[16, "2:06 AM"],[17, "1:10 AM"],[18, "1:19 AM"],[19, "1:15 AM"],[20, "1:33 AM"],[21, "1:38 AM"],[22, "1:13 AM"],[23, "3:30 AM"],[24, "1:12 AM"],[25, "1:15 AM"],[26, "1:21 AM"],[27, "2:03 AM"],[28, "1:46 AM"],[29, "1:18 AM"]]              
        },
        yaxis: {
                     min: -2000,
                     max: 1000,                  
                },
        series: {
            lines: {
                show: true,
                fill: true
            },
            points: {
                show: true,
            }
        },  
        grid: {
            hoverable: true,
            clickable: true,
            markings: [
            { color: '#000', lineWidth: 1, yaxis: { from: 0, to: 0 } },
                    ]
        },
        legend: {
            show: false
        }
    });

$("#placeholder").bind("plothover", function(event, pos, item) {
            if (item) {
                if (previousPoint != item.dataIndex) {
                    previousPoint = item.dataIndex;

                    $("#tooltip").remove();
                    var y = item.datapoint[1].toFixed();

                    showTooltip(item.pageX, item.pageY,
                        item.series.label + " = " + y);
                }
            } else {
                $("#tooltip").remove();
                previousPoint = null;
            }
        });

I am trying to get the times part of the categories. The item array has 3 pieces of data, none of which are the times

jFiddle: http://jsfiddle.net/zw14y8c3/2/

Solution

The item.datapoint[0] data has the index of the x-axis tick. With that you can get the actual tick label from the ticks array:

var x = $("#placeholder").data('plot').getAxes().xaxis.ticks[item.datapoint[0]].label;

See the updated fiddle for the full example.