如何在inbootstrap 3中添加字形图标加减函数

<link rel="stylesheet" href="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/3.4.1/css/bootstrap.min.css">
<link rel="stylesheet" href="https://cdn.bootcdn.net/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">

<div class="input-group">
  <span class="input-group-btn">
    <button class="btn btn-default" type="button" id="minus-btn"><i class="fa fa-minus"></i></button>
  </span>
  <input type="text" class="form-control" id="quantity" value="1">
  <span class="input-group-btn">
    <button class="btn btn-default" type="button" id="plus-btn"><i class="fa fa-plus"></i></button>
  </span>
</div>

$(document).ready(function() {
  // 减号按钮点击事件
  $('#minus-btn').click(function() {
    var quantity = parseInt($('#quantity').val());
    if (quantity > 1) {
      $('#quantity').val(quantity - 1);
    }
  });

  // 加号按钮点击事件
  $('#plus-btn').click(function() {
    var quantity = parseInt($('#quantity').val());
    $('#quantity').val(quantity + 1);
  });
});