<div class="btn-group">
                <button type="button" class="btn btn-sm btn-success btn-flat dropdown-toggle" data-toggle="dropdown">
                    Action <span class="caret"></span>
                <ul class="dropdown-menu" role="menu">
                    <li><a id="action" class="a" href="#action" data-index="100" data-toggle="done">Done</a></li>
                    <li><a id="action" class="a" href="#action" data-index="100" data-toggle="processing">Processing</a></li>
                    <li><a id="action" class="a" href="#action" data-index="100" data-toggle="error">Error</a></li>
$( "#action" ).on("click", "a.a", function(){

        var id = $(this).data('index');
        var status = $(this).data('toggle');

        var dataString = 'id=' + id + '&status=' + status;
            type: "POST",
            url: "status.php",
            data: dataString,
            cache: false,
            success: function (result) {
                $("#" + id + " td:eq(10) span").text(status);
                $("#" + id + " td:eq(10) span").removeClass();
                $("#" + id + " td:eq(10) span").addClass('bg-' + status);



dymanic button not working on click event.tried with live and delegate.but not working

Instead of

$("#action").on("click", "a.a", function() {

try using:

$("ul.dropdown-menu").on("click", "li > a.a", function() {

Side note: id should be unique, so it would be better to use class="action"

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts learning and sharing knowledge.