Javascript，如何旋转箭头div？

我还没有创建下拉部分，但我希望能够有箭头，我已经创建点向下时，点击。这是我的代码。当我选择div时，我尝试的一切都没有收到任何操作

$（文档）.ready（函数（）{
$（'.circle'）。单击（函数（）{
$（'旋转'）.toggleClass（'旋转'）；
});
});
.header{
利润率：-8px；
高度：75px；
背景色：rgba（222,70,82,7）；
}
.圆圈{
宽度：40px；
高度：40px；
边界半径：60px；
边框：3倍纯色白色；
位置：绝对位置；
左：200px；
顶部：18px；
}
.圆圈2{
宽度：30px；
高度：30px；
顶部：3px；
左：3px；
边界半径：60px；
边框：纯色2px白色；
位置：绝对位置；
}
.阿罗{
内容：''；
显示：块；
位置：相对位置；
顶部：6px；
左：4px；
高度：15px；
宽度：15px；
-webkit边界半径：4px；
-moz边界半径：4px；
边界半径：4px；
边框顶部：4倍纯白；
右边框：4倍纯白；
-webkit变换：旋转（45度）；
-moz变换：旋转（45度）；
-ms变换：旋转（45度）；
-o变换：旋转（45度）；
变换：旋转（45度）；
-webkit过渡：所有0.3轻松输入输出；
-moz转换：所有0.3秒都易于输入输出；
-o-过渡：所有0.3秒的缓进-缓出；
过渡：所有0.3秒的缓进缓出；
}
.轮换{
变换：旋转（25度）；
-webkit变换：旋转（25度）；
-moz变换：旋转（25度）；
-o变换：旋转（25度）；
}

将变换更改为135度后工作

修改的CSS

.rotated{
     transform:rotate(135deg); 
    -webkit-transform:rotate(135deg); 
    -moz-transform:rotate(135deg); 
    -o-transform:rotate(135deg); 
    margin-left: 1px;
}

您忘记添加jquery了吗？（
）^^必须是它。对我来说效果很好-如果你像Kaido指出的那样添加jQuery，当你点击它时，箭头开始旋转。对rotated类的transform属性稍作调整，它就会起作用：“transform:rotate（135度）translateX（-2px）”，我真不敢相信我忘了添加lol，谢谢大家