Question

var btnid=0;
function show_visited_stops(bus_stops_visited,map){


                var $k=0;
                var visited_bus="";
                var total_time=0;
                visited_bus="<table border=\"1\">";
                while($k<bus_stops_visited.length){

                $A=bus_stops_visited[$k];

                if ($k==bus_stops_visited.length-1){
                var latlng=findlatlng($A);
                var name=find_stop_name($A);
                btnid++;
                var btn_id="btn"+btnid;
                visited_bus+="<tr><td><button id="+btn_id+" class=\"linked\">"+name+"</button></td>"+ "<td>"+"Time taken:"+total_time.toFixed(2) +'min'+ "</td></tr>";
                var c="#"+btn_id;
                $(c).on("click", function(event){
                    alert("DSD");
                });

                    break;
                }
                $k=$k+1;
                $B=bus_stops_visited[$k];

                var name=find_stop_name($A);
                btnid++;
                var btn_id="btn"+btnid;
                visited_bus+="<tr><td><button id="+btn_id+" class=\"linked\">"+name+"</button></td>"+ "<td>"+"Time taken:"+total_time.toFixed(2) +'min'+ "</td></tr>";
                var c="#"+btn_id;
                $(c).on("click", function(event){
                    alert("DSD");
                });



                total_time+=parseFloat(find_edge_weight($A,$B));



            //  alert("edge traversed"+edge_traversed);
        }
        visited_bus+="</table>"; 

        alert(visited_bus);
        return visited_bus;
}

I want each button generated to have a click event attached to it. But its not working. I also tried .click() .bind() its not working either.

Any suggestions. I’m stucked
What i want is when each button is clicked, the alert should be fired. (i will replace the alert with another function).

UPDATE:
I got the solution:
i’ve used

$(document).on("click", c, function(){ alert("Goodbye!"); });

Answer 1

Follow the below steps,

Step 1: In the function show_visited_stops change the below line,

visited_bus="<table border=\"1\">";

to

visited_bus="<table border=\"1\" class=\"visited_stops_tbl\">";

Step 2: Implement the .on method in below syntax,

$('.visited_stops_tbl').on ('click', '.linked', function () {
   //btn click function
})

Step 3: Add the Step 2 code in place just after the table is inserted.