vanilla JS tabbed content

markup.html

<h2>Tabs</h2>
<ul id="tab_list">
	<li><a href="#tab01">tab 01</a></li>
	<li><a href="#tab02">tab 02</a></li>
	<li><a href="#tab03">tab 03</a></li>
</ul>
<div id="tab_content_container">
<div id="tab01" class="tab_content">
	<h1>tab 01</h1>
	<br>
	<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque sollicitudin vestibulum diam, id tincidunt lorem adipiscing at. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Vivamus aliquam ultrices eros a vestibulum. Proin eget enim magna, in fermentum nibh. Proin ut erat sit amet lacus ornare convallis. Vestibulum ut metus sapien. Donec tempor dolor eu urna condimentum molestie. Duis hendrerit, ligula vitae venenatis interdum, libero ante elementum augue, sed sodales purus libero quis justo. Integer et elit placerat mauris dictum fringilla viverra ut lacus. Vestibulum lobortis tincidunt nisl, condimentum porttitor purus convallis ac. Quisque at egestas metus. Donec eu augue eget lorem congue iaculis pretium quis libero. Aenean scelerisque dolor eget odio gravida ut feugiat urna bibendum.</p>
	<p>Vivamus imperdiet suscipit vehicula. Nam ut turpis odio, quis vestibulum massa. Integer quis magna sed erat tincidunt semper sed sit amet nibh. Maecenas ornare, eros eu rhoncus adipiscing, nibh nunc lobortis nibh, sit amet lobortis dui mi vel sem. Cras a lacus libero. Duis sed lorem quis lacus porta imperdiet. Aliquam posuere, lectus sed sodales euismod, odio massa ultrices arcu, id hendrerit nisl felis a ligula. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Duis eleifend hendrerit dui eget aliquet. Sed dignissim egestas hendrerit. Sed lobortis dictum augue ut eleifend. Maecenas eu erat metus. Nam egestas porta leo at cursus. Vestibulum commodo, sem eu porta pellentesque, lorem ligula euismod lorem, id posuere magna mauris eu urna.</p>
</div>
<div id="tab02" class="tab_content"> <h1>tab 02</h1>
	<br>

<p>Vivamus imperdiet suscipit vehicula. Nam ut turpis odio, quis vestibulum massa. Integer quis magna sed erat tincidunt semper sed sit amet nibh. Maecenas ornare, eros eu rhoncus adipiscing, nibh nunc lobortis nibh, sit amet lobortis dui mi vel sem. Cras a lacus libero. Duis sed lorem quis lacus porta imperdiet. Aliquam posuere, lectus sed sodales euismod, odio massa ultrices arcu, id hendrerit nisl felis a ligula. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Duis eleifend hendrerit dui eget aliquet. Sed dignissim egestas hendrerit. Sed lobortis dictum augue ut eleifend. Maecenas eu erat metus. Nam egestas porta leo at cursus. Vestibulum commodo, sem eu porta pellentesque, lorem ligula euismod lorem, id posuere magna mauris eu urna.</p>

</div>
<div id="tab03" class="tab_content">
	<h1>tab 03</h1>
	<br>
<p>Estibulum ut metus sapien. Donec tempor dolor eu urna condimentum molestie. Duis hendrerit, ligula vitae venenatis interdum, libero ante elementum augue, sed sodales purus libero quis justo. Integer et elit placerat mauris dictum fringilla viverra ut lacus. Vestibulum lobortis tincidunt nisl, condimentum porttitor purus convallis ac. Quisque at egestas metus. Donec eu augue eget lorem congue iaculis pretium quis libero. Aenean scelerisque dolor eget odio gravida ut feugiat urna bibendum.</p>
<p>Vivamus imperdiet suscipit vehicula. Nam ut turpis odio, quis vestibulum massa. Integer quis magna sed erat tincidunt semper sed sit amet nibh. Maecenas ornare, eros eu rhoncus adipiscing. Sed dignissim egestas hendrerit. Sed lobortis dictum augue ut eleifend. Maecenas eu erat metus. Nam egestas porta leo at cursus. Vestibulum commodo, sem eu porta pellentesque, lorem ligula euismod lorem, id posuere magna mauris eu urna.</p>
</div>
</div>

tabbedContent.js

tabbedContent = function () {

  var self = this,

	tab_list = document.getElementById("tab_list"),
	contentContainer = document.getElementById("tab_content_container"),
	tabContent =	contentContainer.getElementsByClassName('tab_content'),

	initialise = function() {
		var tab_links = tab_list.getElementsByTagName('a');

		_.each(tab_links, function(el){
			el.addEventListener("click", function(e) {
				e.preventDefault();
				closeTabs();
				openTab(el);
			});
		});

		tab_links[0].click();

	},

	closeTabs = function () {
		_.each(tabContent, function(el){
			el.style.display = 'none';
		});
	},

	openTab = function (el) {
		var target = el.hash.substring(1);
		document.getElementById(target).style.display = "block";
	};

	initialise();

	return this;
};