…
var target = e.target;
if ( target.tagName.toLowerCase() == ‘a’) {
var which = target.href.split(’#')¹;
toggle(which);
}
…

Nevertheless, there was nothing wrong with it to begin with. I just wanted to hi-light parts of your code for the sake of making a point. Your code works, and it conveys good technique - as does mine. You can see how nitpicking practically gets us both nowhere.

Your example wouldn’t work, as we are using event delegation, so if I click on a LI or the UL it’ll try find an href where there isn’t any.

Looking closer at your toggling mechanism to switch out content on the right-hand pane, you might want to consider an alternative approach that uses a bridging technique. You see, you’ve bound your abstraction to a specific implementation. This is another side of maintenance that wasn’t taken into consideration. Try running ‘toggle’ from the command line, or running it through a unit test (if we are in fact talking about JavaScript for experts).

Try changing your toggle function to take in an argument (instead of an event object). It’s binded to a click event callback. Even a simple anonymous function can act as a bridge

(excuse the code if it’s mangled, I have no idea what code will look like in your comments.

toc.addEventListener(’click’, function(e) {
var which = this.href.split(’#')¹;
toggle(which);
}, false);

function toggle(which) {
// do stuff…
}