Пользовательского JQuery аккордеона и скрытие следующего DIV

Question

У меня есть пользовательский аккордеон сценарий - («подробнее») http://jsfiddle.net/nJpNb/2/

То, что я хочу быть в состоянии сделать это скрыть предыдущую/следующую DIV при щелчке $. В настоящее время все панели остаются открытыми, поэтому скрипт работает в основном.

Любая помощь здесь будет оценена.

Благодаря

Answer 1

Просто добавьте

$(".newsBody").hide(); 
$('.newsTeaser').show(); 

в первых строках $(".more").click(function() {

DEMO: http://jsfiddle.net/nJpNb/5/

Но пожалуйста кэшировать детали.

Answer 2

Попробуйте добавить ниже 2 строки внутри .more мыши, как показано ниже,

//hide all others and show newsTeaser 
$newsItem.find('.newsBody').hide(); 
$newsItem.find('.newsTeaser').show(); 

DEMO

Полный код:

$(".newsBody").hide(); 
var $newsItem = $('.newsItem'); 
$(".more").click(function() { 

    //hide all others and show newsTeaser 
    $newsItem.find('.newsBody').hide(); 
    $newsItem.find('.newsTeaser').show(); 

    var $parent = $(this).parent(); 
    $parent.hide(); 
    $parent.parent().find(".newsBody").show(); 
}); 
$(".less").click(function() { 
    var $parent = $(this).parent(); 
    $parent.hide(); 
    $parent.parent().find(".newsTeaser").show(); 

}); 

Answer 3

указан идентификатор для каждого раздела (так что они имеют класс и id). Затем, когда кто-то выбирает секцию 2, автоматически спрятайте секцию 1 и 3