Hello Friends, I am trying to change the case of a button so that each time I click it, it will have a different class and it will bring me an asynchronous server response with ajax exactly for that button. It turns out that the first time I click it, and when I inspect the console, I notice that if you change the class and when you give it the second click it doesn't react, it seems that it didn't recognize the new class, that's my code:
$("#send").click(function(){
$('#send').removeClass("btnuno").addClass("btndos");
});
$(".btndos").on('click',function(){
e.preventDefault();
alert('funciono');
})
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<button id="send" class="btnuno">clik</button>
Your code has two problems:
id="send"
.btndos
, and none exist.Solution:
I recommend you to use event delegation
Example: