Селектор кнопки Bootstrap для обработчика событий click

Question

Как пропустить эту кнопку class="btn btn-danger btn-small" в функции обработчика событий click?

HTML:

<div class="btn-group"> 
    <a class="btn btn-small" data-toggle="modal" data-target="#edit_kategori" href="<?php echo site_url('ckategori/update_kategori/'.$data->id_kategori);?>"><i class="icon-edit"></i></a> 
    <a class="btn btn-danger btn-small" href="#" id="<?php echo $data->id_kategori ?>" ><i class="icon-trash icon-white"></i></a> 
</div> 

JS:

$(".btn btn-danger btn-small").click(function() { 
    var element = $(this); 
    var del_id = element.attr("id"); 
    var info = 'id=' + del_id; 
    if (confirm("Yakin akan menghapus data?")) { 
     $.ajax({ 
      type : "POST", 
      url : "<?php echo base_url(); ?>ckategori/del_ajaxKategori", 
      data : info, 
      success : function() { 
      $('#' + del_id).fadeOut('slow', function() { 
        $(this).remove(); 
       }); 
      } 
     }); 
    } 
    return false; 
}); 

Это не работает. Когда я перехожу на $(".btn").click(function(), все работает отлично, но вся моя группа кнопок вызывает функцию удаления в моем JS.

Что я хочу, когда я нажимаю btn btn-danger btn-small, тогда он вызывает функцию удаления.

Answer 1

Если вы устанавливаете id элемента с помощью PHP переменной

<?php echo $data->id_kategori ?> 

Вы можете также установить идентификатор в селекторе с помощью одной и той же переменной PHP?

$("#<?php echo $data->id_kategori ?>").click(function(){ 
    //DO STUFF 
}); 

---

EDIT: После перечитывая свой вопрос (и платить немного больше внимания к деталям) - ваш селектор в настоящее время:

$(".btn btn-danger btn-small") 

Что ищет элемент тип btn-small в элементе btn-danger в элементе с классом .btn

Он должен быть:

$(".btn.btn-danger.btn-small") 

Это выглядит для любых элементов, которые имеют все три класса .btn, .btn-danger и .btn-small