Как сделать события для соответствующих div?

#javascript #html #jquery

Нужно сделать, чтобы по клику на ссылку появлялся соответствующий div. Вот разметка:


   
Имя

   Редактировать
   

     

        

          Имя
          
          

        
      
    

    

      
Фамилия

      Редактировать
      

        
          

            Фамилия
            
            

          
        
       


Ума хватило только на такой вот код , но в этом случае появляются все инпуты сразу 

jQuery(".edit-settings").click(function () {
  if($('.sett-drop').is(":visible")){
            $('.sett-drop').hide("fast");                
  }else {
    $('.sett-drop').show("fast");
  };
});


Как же сделать так , чтобы при клике на ссылку открывался именно тот div, который
нужно ? Присваивать id не вариант , так как таких блоков довольно таки много.
    

Ответы

Ответ 1

Чуточку поправила код и:



$(".edit-settings").click(function () {
  var
    $this = $(this),
    wrap = $this.closest('.settings-line'),
    drop = wrap.find('.sett-drop');
  
  if(drop.is(":visible")){
    drop.hide("fast");                
  }else {
    drop.show("fast");
  }
});
.sett-drop {
  display: none;
}




   
Имя
   Редактировать
   

      
        

          Имя
          
          

        
      
    

  

  
Фамилия

  Редактировать
  

    

      

        Фамилия
        
        

      
    
  





P.S: Небольшой алгоритм (мне помогает) --> Берем ссылку на которую кликаем $(this)
--> для нее находим обертку в которой она же находится (.settings-line) --> в этой
обертке находим контейнер который скрывается\раскрывается и с ним работаем.


Ответ 2

$('.edit-settings').click(function(event) {
	event.preventDefault();
    var slidePanel = $(this).next();
    $('.sett-drop').not(slidePanel).slideUp(400, function() {
    	slidePanel.slideDown();
    });
});
.sett-drop {
    display: none;
}



    
Имя

    Редактировать
    

        

            

                Имя
                
                

            
        
    



    
Фамилия
    Редактировать
    

        

            

                Фамилия