Find the element before and after a specific element with pure javascript

Assuming your <ul> element is called element:

var active, prev, next;
active = prev = next = element.querySelector('.active');

do prev = prev.previousSibling; while(prev && prev.nodeType !== 1);
do next = next.nextSibling;     while(next && next.nodeType !== 1);

This will work in Internet Explorer 8.

If you’re only worried about modern browsers:

var active = element.querySelector('.active');
var prev = active.previousElementSibling;
var next = active.nextElementSibling;