Buton dinamic stergere Div nou adaugat

[sterica]

Salutare,
Scriptul meu js adauga noi div-uri la apasarea unui buton, tot la apasarea aceluiasi buton vreau sa mai adaug un buton (langa cel de adaugare) care sa apeleze o functie de stergere a div-urilor adaugate iar stergerea divurilor sa se faca ultimul div creat, primul sters, dar numaratoarea div-urilor sa continue atunci cand se doreste adaugarea de noi div-uri. Cand ramane un singur div butonul de stergere sa dispara.

Cod: Selectaţi tot

<div class="col-3 border-col">
<form id='test'>
<h6>Crearea templeate chestionar</h6>
<div class="form-group">
<label for="NumeChestionar">Nume chestionar</label>
<input type="text" class="form-control" id="NumeChestionar" aria-describedby="emailHelp" placeholder="numele templete chestionar">
<small id="NumeChestionarHelp" class="form-text text-muted">help help.</small>
</div>
<div class="form-group">
<label for="intrebarea1">Intrebarea 1</label>
<input type="text" class="form-control" id="intrebarea1" placeholder="adauga intrebare">
</div>
</form>
<button onclick="addDiv('test');">add</button>
</div>

Cod: Selectaţi tot

<script>
var counterText = 1;
function addDiv(divName){
  var newdiv   = document.createElement('div');
  var newbutton = document.createElement('button')

  newdiv.innerHTML ="<div class='form-group'><label for='intrebarea" + (counterText + 1) + "'>Intrebarea " + (counterText + 1) + "</label><input type='text' class='form-control' id='"+ (counterText + 1) +"' placeholder='adauga intrebare'></div>";
  newbutton.innerHTML = "<button onclick='removeDiv();'>remove</button>";
  counterText++;
  document.getElementById(divName).appendChild(newdiv);
}
</script>

Multumesc!

Salut
Incearca acest script JS la codul html pe care l-ai postat.

Cod: Selectaţi tot

<script>
var div_ix =1;
function addDiv(id_in){
  div_ix++;
  var newdiv ="<div id='new_div"+ div_ix +"' class='form-group'><label for='intrebarea"+ div_ix +"'>Intrebarea "+ div_ix +"</label><input type='text' class='form-control' id='intrebarea"+ div_ix +"' placeholder='adauga intrebare'></div>";
  var btn_remove ="<button id='btn_remove' onclick='removeDiv();'>remove</button>";
  document.getElementById(id_in).insertAdjacentHTML('beforeend', newdiv);
  if(!document.getElementById('btn_remove')) document.getElementById(id_in).insertAdjacentHTML('afterend', btn_remove);
}

function removeDiv(){
  document.getElementById('new_div'+ div_ix).outerHTML ='';
  if(div_ix ==2) document.getElementById('btn_remove').outerHTML ='';
  div_ix--;
}
</script>

Salutare,

Butonul de remove functioneaza numai cand este new_div2, cand se depaseste valoare de 2, butonul remove nu mai functioneaza.

Multumesc!

Am rezolvat problema, butonul remove nu avea setat type si facea un submit formului unde se afla.
Dupa ce am definit type='button' functioneaza, insa nu imi explic din ce cauza