Copy row doesn't work other ajax function

Question

I create copy row with jquery append function , use it add and remove button , there is jquery mask for phone input inside first row of table.

Phone mask working first row but not working copy row.

    $(document).ready(function(){
     var cnt = 2;

    $(".addCF").click(function(){

        $("#customFields").append('<tr><td><input type="text" name="adsoyad[]" style="width:130px"/></td><td><input type="text" name="gorevi[]" style="width:130px"/></td><td><input type="text" id="phone" name="telefon[]" style="width:130px"/></td><td><input type="text" name="dahili[]" style="width:70px"/></td> <td><input type="email" name="eposta[]" style="width:190px"/></td><td><a href="javascript:void(0);" class="remCF"><span class="btn">-</span></a></td></tr>');
    cnt++;
    });
    $("#customFields").on('click','.remCF',function(){
        if (confirm("Silmek istediğinizden emin misiniz?"))
        {
        $(this).parent().parent().remove();
        }
    });
     });

   jQuery(function($){
    $("#phone").mask("(999) 999-9999");
    });

http://jsfiddle.net/drxman/hqgenthu/2/

Answer 1

You have to re-append phone mask after appending new row.