I have a page, where I search some ids in typing input using the typeahead library of jquery. When I clicked on the search result which renders in list from the external mouse, it triggered the click event and worked fine. But when I click on the same list from the laptop mouse tracking pad, nothing happened and don't trigger the click event function.

You can check in the video first two ids are searched and clicked by external mouse and added successfully, next one is search and click by laptop mouse tracking pad but nothing happened

Code snippet attached which is running behind this clicked

  $('.typeahead').on('click', function () {
        var item = $('#station_no_typeahead').val();
        $("#station_no_typeahead").val(null);
        if(selectedStationsArr.length < 10){
            //check if this item already exist in the list
            if($.inArray(item, selectedStationsArr) == -1) {
                selectedStationsArr.push(item);
                renderFromArray();
                console.log('Render Done');
            } else {
                console.log('Already in the list');
            }

        } else {
            console.log('Limit Reached');
            ShowErrorAlertCustomB5('Maximum selection of station is 
            reached.');
        }
    });