Calling Api jquery click function on generated html button

Question

Hello folks I'm having a problem trying to call a click event on a html element generated.

Here is the HTML I generate:

function get_buttons($id)
{
    $ci = & get_instance();
    $html='';
    $html .=  '<a id="edit_'.$id.'" href="#modal_edit" class="edit" >'
            . '<span id="results" class="ui-icon ui-icon-pencil"></span></a>';
    $html .= '<a id="delete_'.$id. '" href="#modal_delete" class="delete" >'
            . '<span class="ui-icon ui-icon-trash"></span></a>';

    return $html;
}

And this is the Jquery function I want to call when the "edit" button is clicked

$(document).ready(function(){
    $(".edit").click(function(){
        alert("Hi");
    });
});

I supposed by putting a class in the tag and calling in the jquery it should work.

Answer 1

Please try with below different cases.

1. .on

   $(document).on( 'click', ".edit", function(){ alert("Hi"); } );

2. .live() However, live() was deprecated in 1.7 in favour of on() , and completely removed in 1.9. The live() signature:

   $(".edit").live( 'click', function(){ alert("Hi"); } );

Answer 2

I found the answer, it needs to get the triggered modal and extract the value from id attribute

$("#modal_edit").on('show.bs.modal', function(event){

    var span = $(event.relatedTarget);

    var id = span.attr('id');

  alert(id);

});