Change Text/Value on Button when clicked not working in FF

JavaScript
1

Hello everyone,

Basically I am looking to show/hide a DIV with the click of a button.

The script work accordingly in IE but fail in FF.

I am sure I am the problem here.


<script type="text/javascript">

function toggle(box) {
	var el = document.getElementById('box');
	el.style.display = (el.style.display != 'none' ? 'none' : '' );
	
	
	value = document.getElementById('content').value;
	if(value=="Show Calendar"){
	document.getElementById('content').value="Hide Calendar";
	}
	else{
	document.getElementById('content').value="Show Calendar";	
}
}
</script>


<style type="text/css">
#box{
	background-color: #C0C0C0;
	height: 100px;
	width: 100px;
}
</style>
</head>

<body>

<div id="box">
</div>

<input id="content" value="Hide Calendar" type="button" onclick="toggle(box)" />
</body>
</html>

Thank!

2

The issue lies when the button click, you have

toggle(box)

which to the function is saying im looking for the box variable from the global scope where as you need it to be a static string been passed to the function

toggle('box')

One thing i would like to ask though is why your passing a value to a function that has no use for it? Seems kind of redundant to me