Javascript 单击按钮时更改按钮文本和图标文件（字体awesome）

我试图在单击时更改按钮的文本及其关联的图标文件，然后再次单击时将其反转。我已经完成了一半，并且能够切换图标的类别和按钮的颜色，但是如果我尝试更改按钮的文本或html，它会删除图标引用。有没有更有效的方法来完成这一切

html

---

您可以使用

if（$（“#openNewSale”）.is（“：hidden”）

检查

openNewSale

的显示状态，并相应地更改类

$( "#newSale" ).click(function() {
  $( "#openNewSale" ).slideToggle( "slow", function() {
     $('#newSale').toggleClass('btn-success').toggleClass('btn-danger');
      if($("#openNewSale").is(":hidden"))
      {
            $( "#newSale" ).html('<i id="iconChange" class="fa fa-plus"></i> add new');      
      }
      else
      {
          $( "#newSale" ).html('<i id="iconChange" class="fa fa-minus"></i> remove'); 
      }
  });
});

$（“#newSale”）。单击（函数（）{
$（“#openNewSale”）.slideToggle（“slow”，function（）{
$（'newSale'）.toggleClass（'btn-success'）.toggleClass（'btn-danger'）；
如果（$（“#openNewSale”）。是（“：隐藏”））
{
$（“#newSale”）.html（'addnew'）；
}
其他的
{
$（“#newSale”）.html（'remove'）；
}
});
});

---

这与我现在正在做的事情基本相同，但代码更多。我需要添加的主要内容是更改按钮的文本，同时保留实际使用的代码类型，但更改了

$（'#iconChange'）.removeClass（'fa-plus'）.addClass（'fa-minus'）的jquery调用

到

.empty（）.html（'addnew'）

然后在else语句中使用相反的命令。真有趣，我也这么回答

$( "#newSale" ).click(function() {
  $( "#openNewSale" ).slideToggle( "slow", function() {
     $('#newSale').toggleClass('btn-success').toggleClass('btn-danger');
     $('#iconChange').toggleClass('fa-plus').toggleClass('fa-minus');
  });
});

$( "#newSale" ).click(function() {
  $( "#openNewSale" ).slideToggle( "slow", function() {
     $('#newSale').toggleClass('btn-success').toggleClass('btn-danger');
      if($("#openNewSale").is(":hidden"))
      {
            $( "#newSale" ).html('<i id="iconChange" class="fa fa-plus"></i> add new');      
      }
      else
      {
          $( "#newSale" ).html('<i id="iconChange" class="fa fa-minus"></i> remove'); 
      }
  });
});