Traversing value in a table

tr in a td onfocus have the same value of the first td.

by Ninay is Unknown

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.js"></script>

<table id='TextBoxesGroup'>
    <tr id="TextBoxDiv0">
         <td><input type="text" id="thelist[0].DocDT" name="thelist[0].DocDT" class="dt" /></td>
          <td><input type="text" id="thelist[0].StartDT" name="thelist[0].StartDT" class="name"/></td>
         <td><input type="text" id="thelist[0].EndDT" name="thelist[0].EndDT" class="name"/></td>
    </tr>

    <tr id="TextBoxDiv0">
     <td ></td>
   </tr>
</table>  
	
  
   
  
<input type='button' value='Add Button' id='addButton'>
<input type='button' value='Remove Button' id='removeButton'>
<input type='button' value='Get TextBox Value' id='getButtonValue'>

JavaScript

$(document).ready(function () {
         var counter = 1;
         $("#addButton").click(function () {
             if (counter > 4) {
                 alert("Only 5 textboxes allow");
                 return false;
             }
             var newTextBoxDiv = $(document.createElement('tr'))
                  .attr("id", 'TextBoxDiv' + counter);
             newTextBoxDiv.after().html(
              // td2 + td3 + td4 
               ' <td><input type="text" name="thelist[' + counter +
                   '].DocDT" id="thelist[' + counter +
                   '].DocDT" value="" class="dt"></td> '+

' <td><input type="text" name="thelist[' + counter +
               '].StartDT" id="thelist[' + counter +
                '].StartDT" value="" class="name"></td> '+


'<td><input type="text" name="thelist[' + counter +
                 '].EndDT" id="thelist[' + counter +
                  '].EndDT" value="" class="name"></td>');
              
            
           
             newTextBoxDiv.appendTo("#TextBoxesGroup");
             counter++;
               $(".dt").focus(function(){
  	var trID = $(this).closest("tr").attr('id');
  	//My keyup function
	$(this).keyup(function(){
        $('#' + trID).each(function(){
		   		$(this).find('.name').val($(this).find('.dt').val());
        });
    });
  });


         });
         $("#removeButton").click(function () {
             if (counter == 1) {
                 alert("No more textbox to remove");
                 return false;
             }
             counter--;

             $("#TextBoxDiv" + counter).remove();
         });
   
             
         });