在jquery中切换右箭头向下箭头[accordion-like]

Question

我设计了一种手风琴。当我点击一个项目的右箭头时，说Area A，它会切换到给我的项目列表Area A，同时，箭头右下降（像这样：▼）。当我再次点击它时，列表隐藏，箭头变成箭头 - 再次右键。请注意，在Area A中，我将有一个子列表。有人可以帮助我实现这一目标吗？

►A区

►B区

►C区

如果我点击区A - >

▼A区 - 项目1 - 项目2 ►区域B ►区域C

<ul style="list-style: none;"> 
    <div ng-repeat="area in areas">  
     <div class="arrow-up" style="float:left;"> &#9658; </div>          
      <li> {{area}} </li> 
    <div ng-repeat="x in lists"> 
     <li style="display: none;"> {{x}} </li>    
    </div> 
     <div style="display: none;" class="arrow-down">&#9660;</div> 
    </div> 
</ul> 

myjs

$(#arrow-up').click(function(){ 
    $(this).toggleClass("arrow-down"); 
}); 

Answer 1

你是对这个问题：

$('.arrow-right').click(function(){ // But isn't it an arrow right?? 
             // And should be a class. 
    $(this).toggleClass("arrow-down"); 
}); 

你只是错过了CSS？

这样做：

.arrow-down{ 
    transform: rotate(90deg); /* 90 degres rotation */ 
}