Remove/Delete element from page using JavaScript working in FireFox,IE,Opera

        Few days ago, I was recalling my Java script skill. I was generating Grid using java script script. Instead of using Display property ('none' or 'block') to show or hide the control, I was creating and removing element each time. Creating element is not a big deal. However the script for removing element is different in IE and Firefox.

       In IE, we can remove the element using, however this will not work in Firefox.

document.getElementById("ControlID").removeNode(true);

Fig -(1) Script to remove element in IE.

      In Firefox, you have to use,

var Node1 = document.getElementById("ParentControlID");
Node1.removeChild(Node1.childNodes[0]);

Fig -(2) Script to remove element in Firefox.

  Below is the sample code for the same.

      var Node1 = document.getElementById("Parent"); 
      var len = Node1.childNodes.length;
      
       for(var i = 0; i < len; i++)
       {           
            if(Node1.childNodes[i].id == "Child")
            {
                Node1.removeChild(Node1.childNodes[i]);
            }
       }

Fig -(3) Script to remove child element in Firefox.

Happy Programming !