JQUERY DYNAMIC TABLE DELETE PROBLEM

JQUERY DYNAMIC TABLE DELETE PROBLEM

I am dynamically creating a table to add employees. After adding  more than one row, i have deleted the first row. Again adding the same not working..any help will be appreciated. my code is as follows

 function() 
{
$(document).on("click","#btnAdd",function(){
var empid_name = $("#selEng").val();
empid_name = empid_name.split("_");
var empid = empid_name[0];
var empname = empid_name[1];
var hour = $("#txtIHour").val();
if(empid_name=='none')
{
alert('Please select an Engineer');
return false;
}
if(hour<=0)
{
alert('Please enter estimated hour for the selected engineer');
return false;
}
  //var rowCnt = $('#tbladd tbody').children().length-1;
  var rowCnt = $('#tbladd tr').length;
  if(rowCnt==1)
  {
  
  $("#tbladd").append('<tr><td id=Items'+rowCnt+'>'+empname+'</td>+<td>'+hour+'</td>+<td><input type=hidden id=dvId name=dvId[]  value='+empid+' \><input type=hidden id=dvHour name=dvHour[]  value='+hour+' \><input type=button id=btnDelete'+ rowCnt +' name=btnDelete  value=x style=color:red borde:0  class=remove \></td></td>+</tr>');
// $("#tbladd").append('<tr><td id=Items'+rowCnt+'><input type=text id=dvSerial name=dvSerial[] readonly=readonly value='+empname+'</td>+<td>'+hour+'</td>+<td><input type=button id=btnDelete'+ rowCnt +' name=btnDelete  value=x style=color:red borde:0  class=remove \></td></td>+</tr>');
  }
  else
  {
 
    var dupCount = 0;
  for (var i = 0; i < rowCnt; i++) 
  {
 
var num = $("#Items" + i).html();
                  if(num==empname) 
  {
                      dupCount++;
 
                  }
                  }
                  if (dupCount == 0) 
  {
    $("#tbladd").append('<tr><td id=Items'+rowCnt+'>'+empname+'</td>+<td>'+hour+'</td>+<td><input type=hidden id=dvId name=dvId[]  value='+empid+' \><input type=hidden id=dvHour name=dvHour[]  value='+hour+' \><input type=button id=btnDelete'+ rowCnt +' name=btnDelete  value=x style=color:red borde:0  class=remove \></td></td>+</tr>');
                      //$("#tbladd").append('<tr><td id=Items'+rowCnt+'><input type=text id=dvSerial name=dvSerial[] readonly=readonly value='+empname+'</td>+<td>'+hour+'</td>+<td><input type=button id=btnDelete'+ rowCnt +' name=btnDelete  value=x style=color:red borde:0  class=remove \></td></td>+</tr>');
}
                  else 
  {
                        alert("The selected engineer already assigned for the project !");
                 }
  }

// $('#tbladd tbody tr').each(function() {  
// alert($(this).closest('tr').find('td:eq(0)').text());
// var ename = $("#tbladd .tests").text();
// //alert(ename);
// if(ename==empname)
// {
// alert('This member has been already added');
// return;
// }
// else
// {
// $("#tbladd").append('<tr><td class=tests>'+empname+'</td>+<td>'+hour+'</td>+<td><input type=button id=btnDelete name=btnDelete value=remove class=remove \></td></td>+</tr>');
//
// }
//   })
 

          }
       )
});
//To remove rows from dynamic table
$(document).on('click', '.remove', function(e) {

if(confirm('Are you sure want to remove the team member')==true)
{

// $(this).closest('tr').remove();
//        $(".row-id").each(function (i){
//           $(this).text(i+1);
//        }); 
var tr = $(this).closest('tr');
//var index = $(this).closest('tr').index();
//alert(index);
tr.slideUp('slow', function() {
// now that you have slided Up, let's remove it from the DOM
$(this).remove(); 
});
}
else
{
return false;
}
});