jQuery Klickfunktion funktioniert nicht (addClass/removeClass)

Question

Ich habe eine verdeckte Übergabeschaltfläche. Nachdem die Schaltfläche angezeigt wird, soll sie die Klasse von zwei Elementen ändern (mit addClass und removeClass).

Aber das funktioniert nicht und ich kann nicht herausfinden, warum. Der Code scheint mir gut zu sein. Ich habe auch versucht, toggleClass zu verwenden, und ich habe das gleiche Problem.

Bitte helfen Sie mir das zu beheben!
Vielen Dank im Voraus!

Dies ist der Code:

$('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>

Answer 1

Änderung

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

zu

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

mit Raum, kann Jquery nicht das Element finden