jquery click not firing

Question

    <td><input name="SeeUsers" id="SeeUsers" class="SeeUsersButton" value="See Users" type="button" title="#qPages.id#" onclick="ListUsers();"></td>

<script type="text/javascript">

        ListUsers=function(){
            var userid = $(this).title;
            $('.userslistdiv').text(userid);
            $('.userslistdiv').show;
        };

</script>

I've been trying to bind this input to a jquery click event but couldn't get it to fire. So, I dumped the jquery click function and just used onclick=. Neither one fires the event.

The problem may be that the main page has a cfdiv that dynamically loads content that has the input with the onclick=. But I do this on several pages using jquery datepicker without a problem.

In dev tools I can see the script and it is in the head.

Edited code:

    ListUsers=function(el){
        var userid = el.title;
        $('.userslistdiv').text(userid);
        $('.userslistdiv').show;
    };

<input name="SeeUsers" id="SeeUsers" class="SeeUsersButton" value="See Users" type="button" title="#qPages.id#" onclick="ListUsers(this);"></td>

Answer 1

If you are trying to fire an event on a dynamically added element you have to first select an element that already existed that encloses the dynamically added element. This could be a div in which you have appended the new element or you can use the document object if you don't know ahead of time where the element will be added.

Javascript needed:(alert added to let you know the event works)

Code Pen example: http://codepen.io/larryjoelane/pen/zrEWvL

/* You can replace the document object in the parentheses
   below with the id or class name of a div or container 
   that you have appended the td tag
 */
$(document).on("click","#SeeUsers",function(){//begin on click event

            var userid = $(this).title;
            $('.userslistdiv').text(userid);
            $('.userslistdiv').show;

           //test to see if event fired!
           alert("it worked");

        });//end on click event

Answer 2

this inside the ListUsers does not refer to the clicked element so you need to pass the clicked element reference as a param

<input name="SeeUsers" id="SeeUsers" class="SeeUsersButton" value="See Users" type="button" title="#qPages.id#" onclick="ListUsers(this);">

then

ListUsers = function(el) {
    var userid = el.title;
    $('.userslistdiv').text(userid);
    $('.userslistdiv').show();
};

--

But since you have jQuery, use jQuery to handle events

jQuery(function ($) {
    $('#SeeUsers').click(function () {
        var userid = this.title;
        $('.userslistdiv').text(userid);
        $('.userslistdiv').show(); //it is a function
    });
})