jQuery 点击功能无效 (addClass / removeClass)

jQuery click function not working (addClass / removeClass)

我有一个隐藏的提交按钮。按钮显示后,它应该更改两个元素的class(使用addClass和removeClass)。

但这不起作用,我不明白为什么。代码对我来说似乎很好。 我也尝试过使用toggleClass,但我遇到了同样的问题。

请帮我解决这个问题!
提前致谢!

这是代码:

$('input[data-act="save"]').click(function(e) {
  e.preventDefault();
  var id2 = $(this).attr("data-c");
  var bkg = $('[data-sel="td ' + id2 + '"]');
  $(bkg).addClass("bg-color-fin");
  $(bkg).removeClass("bg-color");
});
.bg-color {
  color: #ffffff;
  background-color: #329af0;
  text-shadow: 0 1px 0.5px #000000;
}
.bg-color-fin {
  color: #ffffff;
  background-color: #37b24d;
  text-shadow: 0 1px 0.5px #000000;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
  <tr>
    <td data-sel="td1" class="text bg-color title2 border-bot" colspan="4">
    </td>
  </tr>
  <tr>
    <td data-sel="td1" colspan="4" class="text bg-color">
      <div data-id="icn">
        <span class="title2"> I. Details</span>
        <span data-sel="sel1" class="r-float r-pad tiny-txt3">0/1</span>
        <input data-sel="sel1" data-c="1" data-act="save" class="inv r-float btn2 btn2-save btn-right" type="submit" value="Salveaza" target="">
      </div>
    </td>
  </tr>
</table>

改变

var bkg = $('[data-sel="td ' + id2 + '"]');

var bkg = $('[data-sel="td' + id2 + '"]');

与space、Jquery找不到元素