css更改jquery语法

对于我的站点，我尝试使用一个从向下箭头变为向上箭头的箭头。我想使用css更改，因为我觉得这是最简单的方法。我的代码是

$(".first1").on('click', 
  function () {
$('.arrow-down').css({"display" : "none"});
    $('.arrow-up').css({"display" : "inline"});
  },
  function () {
    $('.arrow-down').css({"display" : "inline"});
    $('.arrow-up').css({"display" : "none"});
  });
$(".last1").on('click', 
  function () {
    $('.arrow-down').css({"display" : "none"});
    $('.arrow-up').css({"display" : "inline"});
  },
  function () {
    $('.arrow-down').css({"display" : "inline"});
    $('.arrow-up').css({"display" : "none"});
  });

及

---

不能像那样绑定两个单击事件。相反，您必须自己管理“单击状态”：

$(".first1, .last1").data('active', false);

$(".first1, .last1").on('click', function () {
   if ($(this).data('active')) {
      $('.arrow-down').css({"display" : "none"});
      $('.arrow-up').css({"display" : "inline"});
      $(this).data('active', false);
   }
   else {
     $('.arrow-down').css({"display" : "inline"});
     $('.arrow-up').css({"display" : "none"});
     $(this).data('active', true);
   }
});

$(".first1, .last1").data('active', false);

$(".first1, .last1").on('click', function () {
   if ($(this).data('active')) {
      $('.arrow-down').css({"display" : "none"});
      $('.arrow-up').css({"display" : "inline"});
      $(this).data('active', false);
   }
   else {
     $('.arrow-down').css({"display" : "inline"});
     $('.arrow-up').css({"display" : "none"});
     $(this).data('active', true);
   }
});