0

I have code that should change the anochor and the id value when clicking on it. The value and the anchor are changing, but only 1 time. can you tell me why it's not working?

HTML

<a href="#" id="enable-edit-button">EDit</a>

JS

<script type="text/javascript">
$(document).ready(function()
{
    $("#enable-edit-button").click(function()
    {
        $(this).attr("id","save-edit-button");
        $(this).html("SAVE");

    });

    $("#save-edit-button").click(function()
    {
        $(this).attr("id","enable-edit-button");
        $(this).html("EDIT");   
});

});
</script>
roi
  • 7
  • 1
  • I marked this as a duplicate of a question about changing class dynamically, but the issue and solution are the same when changing ID dynamically. – Barmar Apr 07 '16 at 11:41

2 Answers2

0

Your question is defined here.. Difference between .on('click') vs .click()

$('body').on('click', '#save-edit-button', function() { ... });
Community
  • 1
  • 1
shivansh
  • 450
  • 4
  • 8
0

Try this

$(document).ready(function ()
{
    $(document).on('click', "#enable-edit-button", function ()
    {
        $(this).attr("id", "save-edit-button");
        $(this).html("SAVE");

    });
    $(document).on('click', "#save-edit-button", function ()
    {
        $(this).attr("id", "enable-edit-button");
        $(this).html("EDIT");
    });

});
Shadab Mehdi
  • 604
  • 10
  • 23