jQuery on button click not working

Question

I am using jquery mobile click function, however, it is not working.

Here is an example of the button that I have, and it is contained within a grid:

<div class="ui-block-c"><a class="request" data-role="button" data-id="\"'+json[i].num+'\" data-type="3" data-icon="plus" data-iconpos="right">Test</a></div>

jQuery function:

$('.request').on('click', function() {
    alert("hi");
});

How do I fix this?

Answer 1

It looks like you are adding this element dynamically, so you'll need to use a delegated event listener:

$(document).on('click', '.request', function() {
    alert("hi");
});

Also you have an issue with your escaped quotes not matching. I don't think those are necessary:

<div class="ui-block-c"><a class="request" data-role="button" data-id="'+json[i].num+'" data-type="3" data-icon="plus" data-iconpos="right">Test</a></div>