I'm new to jQuery and have been stuck on this problem for days now! I have a few buttons in a nav bar that are supposed to open specific divs below. I used slideToggle to open them, which is working well. However, if "la carte" is open, and I click on "les addresses," the div for "la carte" stays open! How do I make it so that if you click on one button, whatever div is already open will close? Please help!!
HTML:
<body>
<div class="nav">
<ul>
<li id="t-menu"><a id="button">la carte</button></li>
<li id="t-adresses"><a id="button2">les adresses</a></li>
<li id="t-presse"><a id="button3">la presse</a></li>
<li id="t-contact"><a id="button4">contact</a></li>
</ul>
</div>
<div id="menu">
<p>5 euro sandwichs | 6 euro salades</p>
<ul>
<li class="first"><strong>L'Original</strong><br>houmous, carottes, dés d'aubergine, salade</li>
<li class="item"><strong>Le Grec</strong><br>tapenade olives-tomate, oignons rouges, fromage, salade</li>
<li class="item"><strong>Le Redneck</strong><br>sauce philadelphia barbecue, tomate, mais, cornichon</li>
<li class="noborder"><strong>Le Veggie Fest</strong><br>tapenade aubergines, carottes, mais, salade</li>
<li class="middle"><strong>Le Provençal</strong><br>caviar de tomates, crème d'artichaut, concombre, carottes, dés d'aubergine</li>
<li class="middle"><strong>Attention</strong><br>traces de sésame et de noix</li>
</ul>
</div>
<div id="map">
<h3>Notre addresse</h3>
<p>On se trouve à 17 Rue d'Algérie à Lyon</p>
<iframe width="600" height="450" frameborder="0" style="border:0" src="https://www.google.com/maps/embed/v1/place?q=17%20Rue%20d'Alg%C3%A9rie%2C%20Lyon%2C%20France&key=AIzaSyAKr9uzWTir1ejce2UfXBIfX1R1UcWQsoM"></iframe>
<p>D'autres locaux à venir!</p>
</div>
jQuery:
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script>
});
$(document).ready(function(){
var par=$("#menu").hide();
$("#button").click(function(e){
$("#menu").slideToggle("slow");
e.preventDefault();
});
});
$(document).ready(function(){
var par =$("#map").hide();
$("#button2").click(function(e){
$("#map").slideToggle(500);
e.preventDefault();
});
});
</script>