<html>
<head>
<style>
<!--
#tutor_group{font-weight:bold;
font-size:14px;left:0px;
margin-top:0px;
width:150px;}
#tutor_group ul{position:relative;
width:150px; padding-left:0px;
margin-left:0px; margin-top:1px;}
#tutor_group ul li{display:inherit;
cursor:pointer;width:150px; padding-left:0px;
margin-left:0px; text-indent:5px;
margin-top:2px; margin-bottom:1px;
background:#0000FF
url(../../images/tutor_image/nav_down.jpg) no-repeat;
color:#FFFFFF; line-height:29px;}
#tutor_group ul li span{width:149px;
padding-left:0px; margin-left:0px;
clear:both}
#tutor_group ul li.up{background:
url(../../images/tutor_image/nav_up.jpg)
no-repeat #000099;}
#tutor_group ul li a{clear:both;
display:block; width:149px; background:#0099FF;
color:#000000; border-top:solid #FFFFAA 1px;
border-bottom:solid #FFFFAA 0px;
text-decoration:none}
#tutor_group ul li a:hover{ background:#999999;
color:#FFFFFF}
-->
</style>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> (Note: You can also down load this JQuery plugin and reference it locally)
<script type="text/javascript">
<!--
$(document).ready(function(){
$("#tutor_group ul li").click(function(){
$(this).parents("ul").parents("div").
children("ul").children("li.up").not(this).
removeClass("up");
$(this).parents("ul").parents("div").
children("ul").children("li").not(this).
children("span").slideUp();
$(this).toggleClass("up");
$(this).children("span").slideToggle();
});
});
//-->
</script>
</head>
<body>
<div align="left" id="tutor_group">
<ul align="left">
<li>TUTORIALS
<span style="display:none">
<a href="#">HTML</a>
<a href="#">XHTML</a>
<a href="#">CSS</a>
<a href="#">XML</a>
<a href="#">XSL</a> </span> </li>
<li>SCRIPTING
<span style="display:none">
<a href="#">JavaScript</a>
<a href="#">VBScript</a>
<a href="#">DHTML</a>
<a href="#">ASP</a>
<a href="#">ADO</a> </span> </li>
<li>VALIDATION
<span style="display:none">
<a href="#">Validate HTML</a>
<a href="#">Validate XHTML</a>
<a href="#">Validate CSS</a>
<a href="#">Validate XML</a>
<a href="#">Validate WML</a> </span> </li>
</ul>
</div>
</body>
</html> Note again: You must embed jQuery plugin before this code can work perfectly. You can search for the new version from their website: jquery.com .
