Динамически изменять “id” и “label for” у инпутов

$('#add-field').on('click', function(){ 
  var nextId = $('input[type=checkbox]').length + 1; 
   
  $('#wrapper').append('<input type="checkbox" id="id' + (nextId) + '"><label for="id' + nextId + '">Checkbox ' + nextId + '</label>'); 
});

label:after { 
  content: ''; 
  display: block; 
  margin-top: 10px; 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div id="wrapper"> 
  <input type="checkbox" id="id1"> 
  <label for="id1">Checkbox 1</label> 
 
  <input type="checkbox" id="id2"> 
  <label for="id2">Checkbox 2</label>   
</div> 
 
<button id="add-field">Добавить</button>

Array.from(document.querySelectorAll('label[for]')).forEach(l => { 
  let id = l.getAttribute('for'), 
      inp = document.querySelector(`#${id}`), 
      newID = id + '1'; // Главное - не генерируйте для ВСЕХ элементов один ID; один раунд - один ID 
       
  if(inp) 
    l.setAttribute('for', newID), inp.setAttribute('id', newID); 
});

<input type="checkbox" id="id1"> 
<label for="id1">Checkbox 1</label> 
 
<input type="checkbox" id="id2"> 
<label for="id2">Checkbox 2</label>