Added textbox via javascript not detected by form when submitted

I have a javascript which adds text boxes when clicked, I tried to submit the data but it can only detect the original textbox

Here is the code of javascript

  var textbox = document.createElement('input');
  textbox.setAttribute('type', 'text');
  textbox.setAttribute('name','description[]');
  textbox.setAttribute('id', 'tasks');
  textbox.setAttribute('class', 'form-control form-control2');
  textbox.setAttribute('required', 'true');
  textbox.setAttribute('placeholder', 'Describe Problem Encountered...');
  document.getElementById('appendtb').appendChild(textbox);

Here is a part of code in html

 <tr>
     <td colspan="6" id="appendtb">
         <!-- this is the textbox that it detects-->
         <?php echo form_input(['name'=>'description[]','placeholder'=>'Describe Problem Encountered...','class'=>'form-control form-control2','required'=>'true','id'=>'task']); ?>
      </td>
 </tr>
 <tr>
     <td colspan="3">
         <input type="button" id="addTask" onclick="addTaskfield()" class="btn btn-outline-primary" name="btnAddTask" value="Add Task"/> 
     </td>
     <td colspan="3" align="right">
         <?php echo form_submit(['name'=>'submit','value'=>'Submit Request','class'=>'btn btn-outline-success btn-submitC']); ?>
     </td>
 </tr>

Here is the PHP code

$description = $this->input->post('description');
print_r($description);
exit();