I am trying to use jQuery to switch a button’s label on each click.
Following is the code I have implemented :
<html>
<head>
<script src="jquery-1.8.2.js"></script>
<script>
$(document).ready(function(){
$("#details_button").click(function() {
var button_text = $("#details_button").attr("text");
button_text == "Hide" ? $("#details_button").text("Details") : $("#details_button").text("Hide");
});
});
</script>
</head>
<body>
<button id="details_button" type="button">Details</button>
</body>
</html>
I expect the label in ‘details_button’ to change each time it is clicked, from ‘Details‘ to ‘Hide‘ and vice versa.
But it only changes once, from ‘Details‘ to ‘Hide‘, and then it does not change on later clicks.
What am I missing here ?
change
$("#details_button").attr("text");to$("#details_button").text();