JS remove last child?

Question

When I add a few of <select> ex. SELECT_country, SELECT_country1, SELECT_country2 I would like to remove them in the order of appearance from the newest one to oldest one. But it is removing from oldest one to newest one. I thought SELECT_country is parent, and I will be deleting its child, but the parent goes away first.

How I can change it?

var j = 0;

function add_country() {
    j++;
    var select = document.getElementById("SELECT_country");
    var clone = select.cloneNode(true);
    clone.setAttribute("id", "SELECT_country" + j);
    clone.setAttribute("name", "country" + j);
    document.getElementById("DIV_country").appendChild(clone);
}

function remove_country() {
    var select = document.getElementById('SELECT_country');
    select.parentNode.removeChild(select);
}

Answer 1

Since you are appending new elements you need to get the last element by using lastChild if you want to remove them from newest to oldest.

function remove_country() {
  var select = document.getElementById('DIV_country');
  select.removeChild(select.lastChild);
}

JSFiddle Demo: https://jsfiddle.net/rrkroxcb/1/