I am currently working on a project where I am using Bootstrap to change the color of a button when clicked. However, it seems like there is an issue as the button is not changing its color upon clicking.
Below is the code for my button -
<td>
<a id="mylink" href="#"><button class="btn btn-default btn-xs">{% trans %}Allow{% endtrans %}</button></a>
</td>
Here is my JavaScript code ---
<script type="text/javascript">
$(document).ready(function() {
if (localStorage.getItem('isClicked')) {
$("#mylink").addClass('btn-success');
$("#mylink").removeClass('btn-default');
}
$('#mylink').on('click', function() {
$(this).addClass('btn-success');
$(this).removeClass('btn-default');
// setting the value upon clicking
localStorage.setItem('isClicked', true);
});
});
The goal is to have the button change color when clicked, and upon revisiting the page, it should check if it has been activated. Can someone please assist me in resolving this issue?