Find out which and where an event is register by jQuery can be tricky. Select the element in Elements panel in DevTool in Chrome and select Event Listeners tab in the right side the the panel. You can only locate the javascript code inside jQuery. And all event point to the same location in jQuery. What you actually see is the event handler of jQuery, jQuery add its additional functionality to normal event handlers.

jquery event handler Event Listeners

If you are inspecting a site's javascript code that you don't know before, there is no way to locate the right event code easily and efficiently.

Using findHandlersJS to locate event handler

findHandlersJS is a function can be paste to Chrome debug console and find out actual event handler, event is registered with jQuery. Just paste the following code to console

var findEventHandlers = function (eventType, jqSelector) {
    var results = [];
    var $ = jQuery;// to avoid conflict between others frameworks like Mootools
    var arrayIntersection = function (array1, array2) {
        return $(array1).filter(function (index, element) {
            return $.inArray(element, $(array2)) !== -1;
    var haveCommonElements = function (array1, array2) {
        return arrayIntersection(array1, array2).length !== 0;
    var addEventHandlerInfo = function (element, event, $elementsCovered) {
        var extendedEvent = event;
        if ($elementsCovered !== void 0 && $elementsCovered !== null) {
            $.extend(extendedEvent, { targets: $elementsCovered.toArray() });
        var eventInfo;
        var eventsInfo = $.grep(results, function (evInfo, index) {
            return element === evInfo.element;
        if (eventsInfo.length === 0) {
            eventInfo = {
                element: element,
                events: [extendedEvent]
        } else {
            eventInfo = eventsInfo[0];
    var $elementsToWatch = $(jqSelector);
    if (jqSelector === "*")//* does not include document and we might be interested in handlers registered there
        $elementsToWatch = $elementsToWatch.add(document); 
    var $allElements = $("*").add(document);
    $.each($allElements, function (elementIndex, element) {
        var allElementEvents = $._data(element, "events");
        if (allElementEvents !== void 0 && allElementEvents[eventType] !== void 0) {
            var eventContainer = allElementEvents[eventType];
            $.each(eventContainer, function(eventIndex, event){
                var isDelegateEvent = event.selector !== void 0 && event.selector !== null;
                var $elementsCovered;
                if (isDelegateEvent) {
                    $elementsCovered = $(event.selector, element); //only look at children of the element, since those are the only ones the handler covers
                } else {
                    $elementsCovered = $(element); //just itself
                if (haveCommonElements($elementsCovered, $elementsToWatch)) {
                    addEventHandlerInfo(element, event, $elementsCovered);
    return results;

For example we want to find the click event handler of element with class name ".btn-navbar".

Execute the following code in console:

findEventHandlers("click", ".btn-navbar")

It will return an object array, expand to Object > events > 0 > handler and right click mouse

find out event handler with findHandlersJS

Click Show function definition you will find out the code.