A function that takes an element and returns all descendants of that element, but does not return those whose parent element has the supplied selector.

Usage no npm install needed!

<script type="module">
  import getChildrenWithoutParentSelector from '';


Build Status


Type yarn add get-children-without-parent-selector at the command line to add this to your project.


<div class="foo" id="alpha">

  <div class="foo_bar" id="beta">
    <div class="foo" id="gamma">
      <div class="foo_bar" id="delta"></div>

    <div class="qux">
      <div class="foo_bar" id="epsilon"></div>

    <div class="foo_bar" id="zeta"></div>

import getChildrenWithoutParentSelector from 'get-children-without-parent-selector';

const foo1 = document.getElementById('alpha');
const foo2 = document.getElementById('gamma');

// returns #beta, #epsilon and #zeta only
getChildrenWithoutParentSelector(foo1, '.foo_bar', '.foo');

// returns #delta only
getChildrenWithoutParentSelector(foo2, '.foo_bar', '.foo');