This method toggles element's CSS className and returns element.
Syntax:
element.toggleClassName( className );
Return Value:
Returns an HTML element.
Example:
<html>
<head>
<title>Prototype examples</title>
<script type="text/javascript"
src="/javascript/prototype.js">
</script>
<script>
function showResult(){
if( !$('mutsu').hasClassName('fruit') ){
// This will return false
alert( "Class name is not set" );
}
$('mutsu').toggleClassName('fruit');
// This will toggle the class presence
if( $('mutsu').hasClassName('fruit') ){
// This returns true
alert( "Now Class name is set" );
}
}
</script>
</head>
<body>
<p>Click the button to see the result.</p>
<div id="mutsu" class="apple">
<p>This is test division.</p>
</div>
<br />
<input type="button" value="showResult"
onclick="showResult();"/>
</body>
</html>