I've got this code but it's a bit repeating itself, is there a way to make it shorter?
jQuery(document).ready(function() {
var allTabs = jQuery('#front, #blog, #portfolio, #pages, #colors, #fonts');
allTabs.hide();
jQuery('#front-show').click(function() {
event.preventDefault();
allTabs.hide();
jQuery('#front').show();
});
jQuery('#blog-show').click(function() {
event.preventDefault();
allTabs.hide();
jQuery('#blog').show();
});
jQuery('#portfolio-show').click(function() {
event.preventDefault();
allTabs.hide();
jQuery('#portfolio').show();
});
jQuery('#pages-show').click(function() {
event.preventDefault();
allTabs.hide();
jQuery('#pages').show();
});
jQuery('#colors-show').click(function() {
event.preventDefault();
allTabs.hide();
jQuery('#colors').show();
});
jQuery('#fonts-show').click(function() {
event.preventDefault();
allTabs.hide();
jQuery('#fonts').show();
});
});
allTabs.click(function() {
event.preventDefault();
allTabs.hide();
var id = jQuery(this).attr('id');
var el = jQuery('#'+id.substring(0,id.indexOf('-')));
el.show();
});