I made a recent addition to the master.cs page.
<h4 class="hideAndShow">[ - ] Hide</h4>
Here's the corresponding code in my CSS file:
.hideAndShow
{
position: fixed;
top:120px;
right:420px;
color: white;
background-color:green;
}
Following that, I included this script within the same master.cs page.
<script>
var hideShowBool = true;
$('.hideAndShow').bind('click', function ()
{
if (hideShowBool == true)
{
$(this).replaceWith('<h4 class="hideAndShow">[ + ] Show</h4>');
hideShowBool = false;
} else
{
$(this).replaceWith('<h4 class="hideAndShow">[ - ] Hide</h4>');
hideShowBool = true;
}
});
</script>
The intended behavior: The text [ - ] Hide should switch back and forth between: [ + ] Show and [ - ] Hide.
However, the current issue is that it only changes with the initial click. After replacing [ - ] Hide with [ + ] Show, subsequent clicks do not trigger any changes as expected.
What could be causing this problem? And how can it be rectified?