Javascript: el texto del botón vuelve a ser el predeterminado cuando la página se recarga

Tengo un botón que quiero cambiar su texto cuando hago clic en Deshabilitar para habilitar, el texto del botón ya está cambiado, pero se abre un cuadro de diálogo rápido cuando hago clic en el botón de deshabilitar para preguntar ¿está seguro de que desea deshabilitar a este usuario? ? “, tengo que hacer clic en el botón Aceptar en este cuadro de diálogo, pero después de hacer clic en este botón, la página se vuelve a cargar y el botón vuelve a deshabilitarse tal como está.

Aquí está el botón:

<input type="button" id="delUserButton" onclick="openDelDiv(this,, '');" value="Disable"/> 

JS

 function openDelDiv(btnObj,userId, userName) { $("#userId_delete").val(userId); $("#userName_delete").text(userName); $("#delUserDiv").bPopup(); change(btnObj); } function change(btnObj) { if (btnObj.value === "Disable") btnObj.value = "Enable"; else btnObj.value = "Disable"; } 

Cualquier sugerencia, por favor?

Si ya usa jQuery, úselo para crear también el evento 'click' y para recuperar los datos relevantes (usando data-attributes ) de esta manera:

 $('.myBtn').on('click', function(){ var $btn = $(this) $("#userId_delete").val($btn.data('user-id')); $("#userName_delete").text($btn.data('user-name')); var newVal = $btn.val() == 'Disable' ? 'Enable' : 'Disable'; $btn.val(newVal); });