Recently delving into the realm of jQuery, I've encountered a stumbling block with this particular code:
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button class="add">Add</button>
<script>
$(document).ready(function(){
$("button.add").click(function() {
$(this).after('<div><button class="remove">Remove</button></div>');
});
//Remove items from cart
$("button.remove").click(function(){
$(this).fadeOut();
});
});
</script>
Inserting
<div><button class="remove">Remove</button></div>
after the original add button
leads to smooth functionality. However, whilst new remove buttons are successfully added using the JS code, deleting them poses an issue.
I'm seeking guidance on resolving this dilemma. Any assistance is appreciated.