Hacer que se oculte el menu desplegable cuando clikeas en otro lado jq

Este es el codigo, y el problema que tengo esque cuando le das a un elemento de la lista me despliega el menu pero cuando le das a otro el menu anterior queda alli miismo
imagen:


este es el codigo:

<script type="text/javascript" src="media/js/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$('.down').hide();
$('.main_menu li').toggle(
function(){
$(this).find('.down').slideDown('slow');
},
function(){
$(this).find('.down').slideUp('slow');
});
});
</script>
...
<div class="menu_nav">
<ul class="main_menu">
<li class="primero"><a href="#">Inicio</a></li>
<li class="botonprincipal"><a href="alumnos.html">Alumnos</a>
<ul class="down">
<li class="subboton"><a href="#">Calificaciones</a></li>
<li class="subboton"><a href="#">Servicio</a></li>
<li class="subboton"><a href="#">Servicio Social</a></li>
<li class="subboton"><a href="#">Practicas Profesionales</a></li>
<li class="subboton"><a href="#">Mas...</a></li>
</ul></li>
<li class="botonprincipal"><a href="#">Docentes</a>
<ul class="down">
<li class="subboton"><a href="#">Captura de calificaciones</a></li>
<li class="subboton"><a href="#">Políticas de Operación</a></li>
<li class="subboton"><a href="#">Biblioteca virtual</a></li>
<li class="subboton"><a href="#">Apoyo didactico</a></li>
<li class="subboton"><a href="#">Revistas electronicas de educacion</a></li>
<li class="subboton"><a href="#">Mas...</a></li>
</ul></li>
<li class="botonprincipal"><a href="#">Carreras</a>
<ul class="down">
<li class="subboton"><a href="#">Alimentos y Bebidas</a></li>
<li class="subboton"><a href="#">Informática</a></li>
</ul></li>
<li class="botonprincipal"><a href="#">Acerca</a></li>
<li class="blog_buton"><a href="#">Blog</a></li>
</ul>
</div><!--menu_nav-->

nose si necesiten mas, sino me dicen y subo el codigo completo
Gracias

Intenta cambiando esto:

Código Javascript :

<script type="text/javascript">
$(document).ready(function() {
$('.down').hide();
$('.main_menu li').toggle(
function(){
$(this).find('.down').slideDown('slow');
},
function(){
$(this).find('.down').slideUp('slow');
});
});
</script>

Por esto:

Código Javascript :

<script type="text/javascript">
$(document).ready(function() {
$('.down').hide();
$('.main_menu li').hover(
function(){
$(this).find('.down').slideDown('slow');
},
function(){
$(this).find('.down').slideUp('slow');
});
);
</script>

Gracias otra vez!!!!!!!!!!!! Night~