I have this working code:

  a.parentNode.removeChild(a);

I need to also remove this child's previous sibling, i.e. the element that es before it.

How do I update this? Does MDN have documentation on it?

I have this working code:

  a.parentNode.removeChild(a);

I need to also remove this child's previous sibling, i.e. the element that es before it.

How do I update this? Does MDN have documentation on it?

• javascript
• html
• dom

Share Improve this question Follow edited Sep 1, 2016 at 22:51 Piper 1,27533 gold badges1515 silver badges2626 bronze badges asked Aug 28, 2011 at 22:23 user656925user656925 10

• 3 a.parentNode.removeChild( a.previousSibling ); – Šime Vidas Commented Aug 28, 2011 at 22:25
• developer.mozilla/En/DOM/Node.previousSibling – mVChr Commented Aug 28, 2011 at 22:27
• thank you , do people have these things memorized or do you reference it somewhere, getting tired of googling everything and finding it on random web-sites. thanks again – user656925 Commented Aug 28, 2011 at 22:27
• Btw are you sure that the previous node is an element node? It could be a text node... – Šime Vidas Commented Aug 28, 2011 at 22:27
• For future reference: The DOM reference, more specifically, the Node interface. – Felix Kling Commented Aug 28, 2011 at 22:27

 |  Show 5 more ments

3 Answers 3

Sorted by: Reset to default 9

Ok, here is a solution which takes into account that the previous sibling might not be an element node:

var previous = a.previousSibling;

// iterate until we find an element node or there is no previous sibling
while(previous && previous.nodeType !== 1) {
    previous = previous.previousSibling;
}

// if there is a sibling, remove it
if(previous) {
    previous.parentNode.removeChild(previous);
}

Reference: Node.previousSibling ^[MDN]

You could easily create a function which gives you the previous element node.

I will repeat my ment here:

You can find a reference of all DOM interfaces at MDN, in particular, the Node interface.

  /**
   * Removes all sibling elements after specified
   * @param {HTMLElement} currentElement
   * @private
   */
  _removeNextSiblings(currentElement) {
    while (!!currentElement.nextElementSibling) {
      currentElement.nextElementSibling.remove();
    }
  }

The following code is to remove all sibling elements except for .me

const node = document.querySelector('.me');
const clone = node.cloneNode(true);

const parentNode = node.parentNode;
parentNode.innerHTML = '';
parentNode.append(clone);