<script>
var Tab1 = $('.tab1').css('cursor' , 'pointer'); //присвой этот класс первой кнопке, добавляем урсор
var Tab2 = $('.tab2').css('cursor' , 'pointer');//присвой этот класс второй кнопке, добавляем урсор
var Tab3 = $('.tab3').css('cursor' , 'pointer');//присвой этот класс третей кнопке, добавляем урсор
var Tab4 = $('.tab4').css('cursor' , 'pointer');//присвой этот класс третей кнопке, добавляем урсор
var Tab5 = $('.tab5').css('cursor' , 'pointer');//присвой этот класс третей кнопке, добавляем урсор
var Block1 = $('#rec346028227').show(); //id первого блока с контентом, сразу скрываем
var Block2 = $('#rec346029121').hide(); //id второго блока с контентом, сразу скрываем
var Block3 = $('#rec346029157').hide(); //id третьего блока с контентом, сразу скрываем
var Block4 = $('#rec354740392').hide(); //id четвертого блока с контентом, сразу скрываем
var Block5 = $('#rec354740570').hide(); //id пятого блока с контентом, сразу скрываем
$(Tab1).on('click', function(){//при клике на первую кнопку
$(Block1).toggle();//открываем контент первого блока
$(Block2).hide();//скрываем контент второго блока
$(Block3).hide();//скрываем контент третьего блока
$(Block4).hide();//скрываем контент четвертого блока
$(Block5).hide();//скрываем контент пятого блока
});
$(Tab2).on('click', function(){//при клике на вторую кнопку
$(Block1).hide();//скрываем контент первого блока
$(Block2).toggle();//открываем контент второго блока
$(Block3).hide();//скрываем контент третьего блока
$(Block4).hide();//скрываем контент четвертого блока
$(Block5).hide();//скрываем контент пятого блока
});
$(Tab3).on('click', function(){
$(Block1).hide();//скрываем контент первого блока
$(Block2).hide();//скрываем контент второго блока
$(Block3).toggle();//открываем контент третьего блока
$(Block4).hide();//скрываем контент четвертого блока
$(Block5).hide();//скрываем контент пятого блока
});
$(Tab4).on('click', function(){
$(Block1).hide();//скрываем контент первого блока
$(Block2).hide();//скрываем контент второго блока
$(Block3).hide();//открываем контент третьего блока
$(Block4).toggle();//скрываем контент четвертого блока
$(Block5).hide();//скрываем контент пятого блока
});
$(Tab5).on('click', function(){
$(Block1).hide();//скрываем контент первого блока
$(Block2).hide();//скрываем контент второго блока
$(Block3).hide();//открываем контент третьего блока
$(Block4).hide();//скрываем контент четвертого блока
$(Block5).toggle();//скрываем контент пятого блока
});
</script>
<script>
var TabOne = $('.TabOne').addClass('ActiveTab');
var TabTwo = '.TabTwo';
var TabThree = '.TabThree';
var BlockOne = '#rec256596753'; //id первого блока (открытого изначально)
var BlockTwo = $('#rec256596753').hide(); //id второго блока (который появится при клике)
var BlockThree = $('#rec256596753').hide(); //id третьего блока (который появится при клике)
$(TabOne).on('click', function(){
$(this).addClass('ActiveTab');
$(TabTwo).removeClass('ActiveTab');
$(TabThree).removeClass('ActiveTab');
$(BlockOne).slideDown();
$(BlockTwo).slideUp();
$(BlockThree).slideUp();
});
$(TabTwo).on('click', function(){
$(this).addClass('ActiveTab');
$(TabOne).removeClass('ActiveTab');
$(TabThree).removeClass('ActiveTab');
$(BlockOne).slideUp();
$(BlockTwo).slideDown();
$(BlockThree).slideUp();
});
$(TabThree).on('click', function(){
$(this).addClass('ActiveTab');
$(TabOne).removeClass('ActiveTab');
$(TabTwo).removeClass('ActiveTab');
$(BlockOne).slideUp();
$(BlockTwo).slideUp();
$(BlockThree).slideDown();
});
</script>
<!-- Вариант 2 -->
<script>
var TabOne = $('.TabOne').addClass('ActiveTab');
var TabTwo = '.TabTwo';
var TabThree = '.TabThree';
var BlockOne = '#rec256596753'; //id первого блока (открытого изначально)
var BlockTwo = $('#rec256596753').hide(); //id второго блока (который появится при клике)
var BlockThree = $('#rec256596753').hide(); //id третьего блока (который появится при клике)
$(TabOne).on('click', function(){
$(this).addClass('ActiveTab');
$(TabTwo).removeClass('ActiveTab');
$(TabThree).removeClass('ActiveTab');
$(BlockOne).show();
$(BlockTwo).hide();
$(BlockThree).hide();
});
$(TabTwo).on('click', function(){
$(this).addClass('ActiveTab');
$(TabOne).removeClass('ActiveTab');
$(TabThree).removeClass('ActiveTab');
$(BlockOne).hide();
$(BlockTwo).show();
$(BlockThree).slideUp();
});
$(TabThree).on('click', function(){
$(this).addClass('ActiveTab');
$(TabOne).removeClass('ActiveTab');
$(TabTwo).removeClass('ActiveTab');
$(BlockOne).hide();
$(BlockTwo).hide();
$(BlockThree).show();
});
</script>