Add and edit AJAX element

When I click on create 'Brand':

$('#confirmCreateBrand').click(function(){
brand = $('#createbrand_name').val();
advertiser = $(this).attr('advertiser-id');
user = $(this).attr('user-id');


if(brand == ""){
  $('#createbrand_name').css('border','1px solid red');
  $('#createbrand_name_error').show();
  return false;
}

 var brand = {
        advertiser_id: advertiser,
        name: brand,
        user : user,
        _token :"{{ csrf_token() }}",
      }; 

  $.ajax({
    url: '{{ URL::to('brand/store/') }}',
    type: 'POST',
    dataType: 'JSON',
    data: brand,
    success: function(brand) {
    $('#brandsTable').find('tbody:last-child').append('<tr id="brand-'+brand.id+'"><td>'+brand.name+'</td><td> <button brand-id="'+brand.id+'" brand-name="'+brand.name+'" brand-advertiser="'+{{$advertiser->id}}+'" tabindex="-1" role="dialog" data-toggle="modal" data-target="#editBrandModal" class="editBrandBtn"><i class="fa fa-pencil"></i></button> <button brand-id="'+brand.id+'" brand-name="'+brand.name+'"  tabindex="-1" role="dialog" data-toggle="modal" data-target="#deleteBrandModal" class="deleteBrandBtn"><i class="fa fa-trash"></i></button> </td></tr>');

        $('#createBrand').modal('hide');

      $('#createBrand input').val('');
    }
  }); 

})

This function adds me a tr with the edit and delete buttons.

But when I click on edit in an element after adding it, I do not enter this function. If you refresh the page you are already logged in.

$('.editBrandBtn').click(function(){
name = $(this).attr('brand-name');
brand_id = $(this).attr('brand-id');
alert(brand_id);
$('#editbrand_name').val(name);
$('#confirmEditBrand').attr('brand-id',brand_id);

});