getpreviousuntil

Get all previous siblings of a DOM element until a selector is found

Usage no npm install needed!

<script type="module">
  import getpreviousuntil from 'https://cdn.skypack.dev/getpreviousuntil';
</script>

README

Build Status

getPreviousUntil

This is a packaged version of the Chris Ferdinandi utility function that gets all previous siblings of an element in the DOM until a selector is found.

Installation

npm i getpreviousuntil

Usage

Given the following markup:

<ul>
    <li>Item 1</li>
    <li class="stop-here">Item 2</li>
    <li>Item 3</li>
    <li class="skip-me">Item 4</li>
    <li id="find-me">Item 5</li>
    <li class="skip-me">Item 6</li>
    <li>Item 7</li>
    <li class="stop-here">Item 8</li>
    <li>Item 9</li>
</ul>
import getPreviousUntil from 'getPreviousUntil'

var findMe = document.querySelector('#find-me');

// Returns '<li class="skip-me">Item 4</li>'
var prev = getPreviousUntil(findMe);

// Returns '<li class="stop-here">Item 2</li>'
var prevStop = getPreviousUntil(findMe, '.stop-here');

// Returns '<li>Item 3</li>'
var prevSkip = getPreviousUntil(findMe, ':not(.skip-me)');

The matches() method was implemented inconsistently with vendor prefixes across many browsers for a while. You should include a polyfill for it to make sure these work properly.