请好手帮忙看下这段代码 _JavaScript

请高手帮忙看下这段代码
代码如下

index.html



<html>

<head>

	<link rel="stylesheet" href="view/leaflet.css" />

	<!--[if lte IE 8]>

		<link rel="stylesheet" href="view/leaflet.ie.css" />

	<![endif]-->

	<link rel="stylesheet" href="view/bootstrap.min.css">

	<link rel="stylesheet" href="view/bootstrap-theme.min.css">

	<link href="view/bootstrap-combined.no-icons.min.css" rel="stylesheet">

	<link href="view/font-awesome.css" rel="stylesheet">

	<link rel="stylesheet" href="view/style.css"/>

	<script src="js/lib/jquery-1.10.2.min.js"></script>

	<script src="js/lib/bootstrap.min.js"></script>

	<script src="js/lib/bootstrap-dropdown.js"></script>

	<script src="js/lib/bootstrap-button.js"></script>

</head>

<body>

	<!--Insert panel via DOM insertion through jQuery in the future-->

	<div id="panel" style="background-color:maroon;">

        <div style="position:absolute; float:right;">

		<button id="paneltoggle" class="btn">Hide panel</button>

	</div>

	<div id="map"></div>

</body>

	<script src="http://cdn.leafletjs.com/leaflet-0.6.4/leaflet.js"></script>

	<script src="js/map.js"></script>

	<script src="js/panel.js"></script>

</html>

panel.js:



$('.dropdown-toggle').dropdown();



var hidden=false;



$("#paneltoggle").click(function() {

	$("div.panel").toggle(1000);

	$("div.map").attr("style", "width:100%;");

});

我想点击按钮来隐藏面板，显示整块地图。但现在点击Hide Panel按钮只能隐藏panel里的东西，但红色背景还是存在，而且地图部分不能变成100%。

小弟初接触javascript,请版里高手指点。

------解决方案--------------------
$("#paneltoggle").click(function() {
    $("div#panel").toggle(1000);
    $("div#map").attr("style", "width:100%;");
});
.是class #为id
------解决方案--------------------
把那个按钮放到那个要隐藏的div外面来
------解决方案--------------------
<body>
    
    <div id="panel" style="background-color:maroon;">
        <div style="position:absolute; float:right;">
        <button id="paneltoggle" class="btn">Hide panel</button>
    </div>
    <div id="map"></div>
</body>
少个闭合的div啊