Менеджер вкладок (Осторожно г*внокод)

Здравствуйте!

Насколько костыльно я сделал менеджер вкладок?

Хотелось бы услышать какие-то комментарии и желательно советы по улучшению, только учусь JavaScript'у.

Разметку и верстку прикладываю.

Верстка: http://smart-kids-shop.ru/dd/

HTML:

            <div class="col-md-12">
                    <ul>
                        <li><a class="denis">ДЕНИС</a></li>
                        <li><a class="anya">АНЯ</a></li>
                        <li><a class="artem">АРТЕМ</a></li>
                        <li><a class="yulia">ЮЛЯ</a></li>
                    </ul>
                </div>
            </div>
        <div id="denis">
            <div class="col-md-6">
                <h2>Персональный тренер - Денис</h2>
                <hr align="left">
                <p>« Регулярные тренировки и правильное питание -
                    залог здоровья и красоты! ЕМS-тренировки - это
                    инновация в сфере фитнеса. Отличное решение для создания
                    фигуры мечты и укрепления здоровья.
                    Моя цель - привести клиента к желаемому результату »</p>
            </div>
            <div class="col-md-6">
                <img class="trainer" src="img/denis.png" alt="">
            </div>
        </div>
        <div id="anya">
            <div class="col-md-6">
                <h2>Персональный тренер - Аня</h2>
                <hr align="left">
                <p> Тренер Аня <br> Таким образом дальнейшее развитие
                    различных форм деятельности в значительной степени
                    обуславливает создание существенных финансовых и
                    административных условий. Повседневная практика показывает,
                    что сложившаяся структура организации способствует подготовки и
                    реализации форм развития. Таким образом рамки и место обучения
                    кадров влечет за собой процесс внедрения и модернизации систем массового участия.</p>
            </div>
            <div class="col-md-6">
                <img class="trainer" src="img/denis.png" alt="">
            </div>
        </div>
    <div id="artem">
        <div class="col-md-6">
            <h2>Персональный тренер - Артем</h2>
            <hr align="left">
            <p> Тренер Артем <br> Таким образом дальнейшее развитие
                различных форм деятельности в значительной степени
                обуславливает создание существенных финансовых и
                административных условий. Повседневная практика показывает,
                что сложившаяся структура организации способствует подготовки и
                реализации форм развития. Таким образом рамки и место обучения
                кадров влечет за собой процесс внедрения и модернизации систем массового участия.</p>
        </div>
        <div class="col-md-6">
            <img class="trainer" src="img/denis.png" alt="">
        </div>
    </div>
    <div id="yulia">
        <div class="col-md-6">
            <h2>Персональный тренер - Юля</h2>
            <hr align="left">
            <p> Тренер Юля <br> Таким образом дальнейшее развитие
                различных форм деятельности в значительной степени
                обуславливает создание существенных финансовых и
                административных условий. Повседневная практика показывает,
                что сложившаяся структура организации способствует подготовки и
                реализации форм развития. Таким образом рамки и место обучения
                кадров влечет за собой процесс внедрения и модернизации систем массового участия.</p>
        </div>
        <div class="col-md-6">
            <img class="trainer" src="img/denis.png" alt="">
        </div>
    </div>

JS:

$( document ).ready(function () {
    $('a.denis').addClass( "active" );
    $('#anya').hide();
    $('#artem').hide();
    $('#yulia').hide();
})
$('a.anya').click(function () {
    $('#denis').hide();
    $('#yulia').hide();
    $('#artem').hide();
    $('a.denis').removeClass( "active" );
    $('a.yulia').removeClass( "active" );
    $('a.artem').removeClass( "active" );
    $('a.anya').addClass( "active" );
    $('#anya').show();
})
$('a.denis').click(function () {
    $('#anya').hide();
    $('#yulia').hide();
    $('#artem').hide();
    $('a.anya').removeClass( "active" );
    $('a.yulia').removeClass( "active" );
    $('a.artem').removeClass( "active" );
    $('a.denis').addClass( "active" );
    $('#denis').show();
})
$('a.artem').click(function () {
    $('#anya').hide();
    $('#yulia').hide();
    $('#denis').hide();
    $('a.anya').removeClass( "active" );
    $('a.yulia').removeClass( "active" );
    $('a.denis').removeClass( "active" );
    $('a.artem').addClass( "active" );
    $('#artem').show();
})
$('a.yulia').click(function () {
    $('#anya').hide();
    $('#artem').hide();
    $('#denis').hide();
    $('a.anya').removeClass( "active" );
    $('a.artem').removeClass( "active" );
    $('a.denis').removeClass( "active" );
    $('a.yulia').addClass( "active" );
    $('#yulia').show();
})

Внимание на этот блок: