Cacher is the code snippet organizer for pro developers

<div class="tabs">
	<ul class="tabs_head">
		<li class="tabs_head_item active">
			<button class="tab-title">Titre 1</button>
		</li>
		<li class="tabs_head_item">
			<button class="tab-title">Titre 2</button>
		</li>
	</ul>
	<ul class="tabs_body">
		<li class="tabs_body_item active">
			#content 1
		</li>
		<li class="tabs_body_item">
			#content 2
		</li>
	</ul>
</div>

function tabs() {
  $('.tabs .tab-title').on("click", function() {
  	var $obj = $(this);
  	var $headTab = $obj.closest('.tabs .tabs_head_item');
  	var index = $headTab.index('.tabs .tabs_head_item');
  	var $bodyTab = $('.tabs .tabs_body_item ').eq(index);

  	$('.tabs .tabs_head .tabs_head_item.active').removeClass('active');
  	$headTab.addClass('active');
  	$('.tabs .tabs_body .tabs_body_item.active').removeClass('active');
  	$bodyTab.addClass('active');
  });
}