Моя функция щелчка работает, когда она не должна быть

Question

Итак, базовая настройка, у меня есть три divs, каждая из которых содержит различный контент, который при загрузке страницы скрыт. В идеале пользователь нажимает на один из div, который расширяет его и отображает содержимое. Они нажимают на другой div, открытый закрывается и открывается один из них.

Проблема заключается в том, что я прямо ссылаюсь на класс, который требуется кликать, моя функция работает в классе, который является «unclickable».

EDIT: Добавлена ​​jsfiddle для лучшей иллюстрации того, что я пытаюсь выполнить: http://jsfiddle.net/ev5ew41q/

Вот мой JavaScript:

$(function() { 
    $('.notContent').click(function() { 
     $(this).switchClass('notContent','isContent'); 
     $('.isContent').switchClass('isContent','notContent'); 
     }); 
}); 

CSS-за notContent (среди прочего) скрывает «[некоторые вещи здесь]». Предполагается, что javascript переключит «notContent» на «isContent» на клик, но ничего больше. Я пробовал использовать if/else, то же самое происходит. Не уверен, что я делаю неправильно.

[редактируется для плохой грамматики]

Answer 1

Просто изменяя класс не отвязать обработчик. Обработчик привязывается к этому элементу во время выполнения! Простое решение действительно просто переключить элемент щелкнул, и скрыть все остальные:

$('.notContent').click(function() { 
    $(this).toggle(); 
    $(".notContent").not(this).hide(); 
});