Как вы можете объединить эти 2 функции в 1?

Question

У меня есть два деления, которые мне нужно показать противоположное при нажатии.

Здесь вы можете увидеть, что я имею в виду: http://thomasbritton.co.uk/projects/akw/

В основном, когда вы нажимаете 1 вариант, он показывает более подробную информацию о нем.

В настоящее время он работает со следующим jQuery:

$('.consumer').live('click', function() {
    $(this).addClass('expanded');
    $(this).next().hide();
    $('.expanded h2').hide();
    $('.striped').hide();
    $('.expanded_content').fadeIn();
});

$('.trade').live('click', function() {
    $(this).addClass('expanded');
    $(this).prev().hide();
    $('.expanded h2').hide();
    $('.striped').hide();
    $('.expanded_content').fadeIn();
});

Но я уверен, что должен быть способ объединить эти 2 функции в 1, я просто не могу понять, как.

Кто-нибудь может помочь с этим?

Спасибо

Answer 1

Может быть, что-то подобное будет работать?Использует .siblings вместо .next / .prev, чтобы получить элемент (ы).

$('.consumer,.trade').live('click', function() {
    $(this).addClass('expanded');
    $(this).siblings('.consumer,.trade').hide();
    $('.expanded h2').hide();
    $('.striped').hide();
    $('.expanded_content').fadeIn();
});

Answer 2

$('.consumer, .trade').live('click', function() {
  $(this).addClass('expanded');
  if ($(this).hasClass('consumer'))
    $(this).next().hide();
  else
    $(this).prev().hide();
  $('.expanded h2').hide();
  $('.striped').hide();
  $('.expanded_content').fadeIn();
});

Answer 3

$('.consumer, .trade').live('click', function() {
    $(this).addClass('expanded');
    $('.options:not(.expanded)').hide();
    $('.expanded h2').hide();
    $('.striped').hide();
    $('.expanded_content', $(this)).fadeIn();
});

Answer 4

$('.consumer, .trade').live('click', function() {
    var $this = $(this).addClass('expanded');
    $this[$this.is('.consumer') ? "next" : "prev"]().hide();
    $('.expanded h2').hide();
    $('.striped').hide();
    $('.expanded_content').fadeIn();
});

Answer 5

$('.consumer,.trade').live('click', function() {
    $(this).addClass('expanded');
    if ($(this).is(".consumer"))
     $(this).prev().hide();
    if ($(this).is(".trade"))
     $(this).next().hide();
    $('.expanded h2').hide();
    $('.striped').hide();
    $('.expanded_content').fadeIn();
});