JQuery переключателя один DIV, когда другие активированное

Question

я действительно застрял с моим кодом, это работает отлично, за исключением одной вещи, мне нужно, чтобы закрыть любой открыли дивы, когда я нажимаю другой DIV, чтобы открыть, вот мой код:

function readFaq() { 

$('.find-faq-inner h3').prepend('<span id="spanfaq" class="faq-open"></span>'); 

$('.find-faq-inner h3').each(function() { 
    var tis = $(this), state = false; 
    var answer = tis.next('div').hide().css('height', 'auto').slideUp(); 

    tis.click(function() { 
     state = !state; 
     answer.slideToggle(state); 
     tis.toggleClass('active', state); 

     if (state == true) { 
      tis.find('#spanfaq').removeClass('faq-open'); 
      tis.find('#spanfaq').addClass('faq-close'); 
     } 
     else { 
      tis.find('#spanfaq').removeClass('faq-close'); 
      tis.find('#spanfaq').addClass('faq-open'); 
     } 

    }); 
    }); 
} 


<div class="find-faq-inner"> 
    <div class="text"> 
    <h3>FAQ1</h3> 
    <div> 
    text of faq 
    </div> 
    </div> 
</div> 

Любые идеи, было бы полезно, спасибо

Answer 1

function readFaq() { 

$('.find-faq-inner h3').prepend('<span id="spanfaq" class="faq-open"></span>'); 

$('.find-faq-inner h3').each(function() { 
    var tis = $(this), state = false, answer = tis.next('div').hide().css('height', 'auto').slideUp(); 
    tis.click(function() { 
     state = !state; 

     $('.find-faq-inner .text div').hide();// This will hide all the divs 

     answer.slideToggle(state); 
     tis.toggleClass('active', state); 

     if (state == true) { 
      tis.find('#spanfaq').removeClass('faq-open'); 
      tis.find('#spanfaq').addClass('faq-close'); 
     } 
     else { 
      tis.find('#spanfaq').removeClass('faq-close'); 
      tis.find('#spanfaq').addClass('faq-open'); 
     } 

    }); 
    }); 
} 

в приведенной выше функции я добавил $('.find-faq-inner .text div').hide();

Это будет скрыть все дивы в find-faq-inner div, используйте его соответственно в своем коде.

Чтобы быть более безопасными вы можете также использовать

$('.find-faq-inner .text > div').hide();

Он скроет только те див, которые являются прямым потомком DIV класса text