php - javascript - Remove form element dynamically

I have a form in my PHP with JavaScript code to add select elements dynamically, which is working nicely :

<tr><th>Requester</th><td><input type="hidden" name="requester" value="<?php echo $_SESSION['user_id']; ?>"><?php echo $_SESSION['user_descr']; ?></td></tr>
<tr>
    <th>User(s) for whom you are requesting the access</th>
    <td>
        <div id="dynamicUsers">
                <?php
                   $q_users = 'SELECT id,descr,tnumber FROM users ORDER BY descr;';
                   $prep = $dbh->prepare($q_users);
                   $prep->execute();
                   $arrAll = $prep->fetchAll();
                   echo '<select name="firecallUsers[]">';
                   foreach($arrAll as $data)
                   {
                        echo '<option value="'.$data['id'].'">'.$data['descr'].'</option>';
                   }
                   echo '</select>';
                ?>
        </div>
        <input type="button" value="Add user" onClick="add_FC_User('dynamicUsers');">
    </td>
</tr>
Copy code

The JavaScript is :

var counter = 1;
var limit = 5;
function add_FC_User(divName){
   if (counter == limit)  {
     alert("You have reached the limit of adding " + counter + " users");
   }
   else {
        var newdiv = document.createElement('div');
        newdiv.innerHTML = '<select name="firecallUsers[]"><?php
        $q_users = 'SELECT id,descr,tnumber FROM users ORDER BY descr;';
        $prep = $dbh->prepare($q_users);
        $prep->execute();
        $arrAll = $prep->fetchAll();
        foreach($arrAll as $data)
        {
            echo '<option value="'.$data['id'].'">'.$data['descr'].'</option>';
        }
        ?></select>';
        document.getElementById(divName).appendChild(newdiv);
        counter++;
   }
}
Copy code

But I would like to add a little "remove" button next to each added element, for example something like this in the javascript :

?></select> <a href="#" onclick="remove_FC_User(''blabla'')"> remove </a>';
Copy code

How can I script this javascript function in order to remove the dynamically-added elements ? I suppose I have to say something like (remove the child div created in parent div called dynamicUsers, but my child div doesn't have a name/id it seems)

any idea ? thanks!

PS : I tried this solution 1 (doesn't work) :

I tried to do something like :

1.adding a name to the div in the javascript, e.g :

var newdiv = document.createElement('div'); newdiv.id = "userDiv";
Copy code

2.creating a function like :

function remove_FC_User(divName){ 
  var child = document.getElementById(userDiv); 
  var parent = document.getElementById(divName); 
  parent.removeChild(child); 
}
Copy code

3.creating the remove link in the JS with :

?></select> <a href="#" onclick="remove_FC_User(\"dynamicUsers\")"> remove</a>';
Copy code

but it won't work :(