In my form I also want to be able to remove elements based on the selected item in another select box. Here is how it works:

in another select box, some of the items have sub-categories, when I select them, the select box contains sub-categories will append the the existing select box( this part is working fine).

But when I select different item in the parent select box, the sub-category select box either will disappear ( no child ) or replaced by different sub-category select box ( different sub-categories ).

My problem right now is removeChild() is not working for me. Since I am not quite familiar with javascript or DOM, can anyone give me some hints. Thanks in advance
script type="text/javascript" src="[% c.uri_for("/static/js/prototype.js") %]"></script>

<script type="text/javascript">
function getSubCat(PID, Container) {
    var category = $(PID);
    var url = 'http://kewei-desktop:3000/admin/subcategories/category/' + category.value;
    new Ajax.Request(url, { 
          method: 'post',
          onSuccess: function(transport) {
              var response = transport.responseText;
              var temp = document.createElement("div");
              if( response.length > 4 ) { 
                  var divIdName = 'category_'+category.value+'_children';
                  temp.setAttribute('id', divIdName);             
                  temp.innerHTML = response;
              else if (response.length == 4){

function removeElement(divID) {;
    var olddiv = $(divID);
$("linkInfo") is the parent