Tarjo Tarjo - 3 months ago 19
Javascript Question

RemoveChild does not work

I have a problem with the use of the javascript removeChild function.
Here's my script:

////function to add element by ID////
var i=1;
$("#buttonAdd").live('click',function() {
$("#list1 li:last-child").parent().append('<li>'+
'<label for=njajal[]>njajal'+
'<textarea class="tinymce" name="njajal[]" id="aaa'+i+'"></textarea>'+
'<span><a class="delIt" id="'+i+'"><b>Hapus</a></span></label>'+
'</li>');
tinyMCE.execCommand('mceAddControl', false, 'aaa'+i);
console.log('add '+i);
i++;
});

////Function to delete element by ID/////
function delIt(eleId)
{
d = document;
var ele = d.getElementById(eleId);
var parentEle = d.getElementById('njajal');
parentEle.removeChild(ele);
}


What is the problem?

Here's the HTML code:

<div id="form">
<form method="post" action="">
<fieldset>
<ol id="list1">
<li>
<label for="njajal[]">njajal
<textarea name="njajal[]" class="tinymce" ></textarea>
</label>
</li>
</ol>
<div id="addOpt">
<a id="buttonAdd" class="bt"><b>Tambah</a>
</div>
</fieldset>
</form>
</div>


Screnshot:
enter image description here

Answer

You use jQuery in your first function, so the easiest way to remove that element would be with jQuery:

$('#myElementID').remove();

Here's how you can accomplish the same thing with plain javascript:

var myElement = document.getElementById('myElementID');
myElement.parentNode.removeChild(myElement);