title: Making menu stay after cliking on it
body: <p><a href="http://jsfiddle.net/2N9Y8/" rel="nofollow">http://jsfiddle.net/2N9Y8/</a></p>
  
  <p>Hello!
  Here is my menu!
  What I want now is that when I click on Program I want the dropdown menu to still be displayed, but not quite sure how to do it. 
  IF anyone also have a clue on how i also can make the dropdown menu stay after i've clicked a link in the dropdown menu that would be nice(when i get directed to another page)</p>
  
  <p><a href="http://jsfiddle.net/2N9Y8/" rel="nofollow">http://jsfiddle.net/2N9Y8/</a></p>
  
  <pre><code> &lt;!DOCTYPE html
  PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"&gt;
  
  &lt;html xmlns="http://www.w3.org/1999/xhtml"xml:lang="sv"&gt;
  &lt;head&gt;
    &lt;meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /&gt;
   &lt;title&gt;Nösnäs&lt;/title&gt;
   &lt;meta name="viewport" content="width=device-width, initial-scale=1"/&gt;
          &lt;link rel="stylesheet" type="text/css" media="screen" href="mobilemenu.css"/&gt;
          &lt;link rel="stylesheet" type="text/css" href="screen.css" /&gt;
  &lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"&gt;&lt;/script&gt;
          &lt;script&gt;
          $(document).ready(function(){
              $(".nav-button").on('click',function () {
              $(".nav-button,.nav").toggleClass("open");
              });    
          });
          &lt;/script&gt;
  &lt;/head&gt;
  &lt;body&gt;
  
  &lt;button class="nav-button"&gt;Toggle Navigation&lt;/button&gt;
  
  
  
  
  
  &lt;ul class="nav"&gt;
  &lt;li&gt;&lt;a href="#"&gt;Program&lt;/a&gt;
  &lt;div class="second nav"&gt;
    &lt;ul&gt;
  &lt;li&gt;&lt;a href="#"&gt;Teknik&lt;/a&gt;&lt;/li&gt;
  &lt;li&gt;&lt;a href="#"&gt;Naturvetenskap&lt;/a&gt;&lt;/li&gt;
  &lt;li&gt;&lt;a href="#"&gt;El&lt;/a&gt;&lt;/li&gt;
  &lt;/ul&gt;&lt;/li&gt;
  &lt;/div&gt;
    &lt;li&gt;&lt;a href="#"&gt;Nösnäs&lt;/a&gt;&lt;/li&gt;
    &lt;li&gt;&lt;a href="#"&gt;Schema&lt;/a&gt;&lt;/li&gt;
    &lt;li&gt;&lt;a href="#"&gt;Matsal&lt;/a&gt;&lt;/li&gt;
     &lt;/ul&gt;
  
  
  
  
  &lt;style&gt;.xg_module_body img {margin:0!important;}&lt;/style&gt;
  &lt;span class="bilder"&gt;
  &lt;div align="center"&gt;&lt;table cellpadding="0" width="150"  cellspacing="0"&gt;&lt;tr&gt;
  &lt;td&gt;&lt;a href="#" target="_blank"&gt;&lt;img src="facebookpic.png" title="Gilla våran Facebook sida" width="35" height="35" border="0"&gt;&lt;/a&gt;&lt;/td&gt;
  
  &lt;td&gt;&lt;a href="#"target="_blank"&gt;&lt;img src="googlepic.png" title="Gilla oss på googlde+" width="35" height="35" border="0"&gt;&lt;/a&gt;&lt;/td&gt;
  
  &lt;td&gt;&lt;a href="#" target="_blank"&gt;&lt;img src="twitterpic.png" title="Följ oss på Twitter" width="35" height="35" border="0"&gt;&lt;/a&gt;&lt;/td&gt;
  
  &lt;td&gt;&lt;a href="#" target=""&gt;&lt;img src="rsspic.png" width="35" height="35" border="0" title="Följ våran RSS"&gt;&lt;/a&gt;&lt;/td&gt;
  &lt;/tr&gt;
  &lt;/table&gt;&lt;/div&gt;
  &lt;/span&gt;
  
  &lt;style&gt;.xg_module_body img {margin:0!important;}&lt;/style&gt;
  &lt;span class="bilderna"&gt;
  &lt;div align="center"&gt;&lt;table cellpadding="0" width="150"  cellspacing="0"&gt;&lt;tr&gt;
  &lt;td&gt;&lt;a href="#" target="_blank"&gt;&lt;img src="facebookpic.png" title="Gilla våran Facebook sida" width="35" height="35" border="0"&gt;&lt;/a&gt;&lt;/td&gt;
  
  &lt;td&gt;&lt;a href="#"target="_blank"&gt;&lt;img src="googlepic.png" title="Gilla oss på googlde+" width="35" height="35" border="0"&gt;&lt;/a&gt;&lt;/td&gt;
  
  &lt;td&gt;&lt;a href="#" target="_blank"&gt;&lt;img src="twitterpic.png" title="Följ oss på Twitter" width="35" height="35" border="0"&gt;&lt;/a&gt;&lt;/td&gt;
  
  &lt;td&gt;&lt;a href="#" target=""&gt;&lt;img src="rsspic.png" width="35" height="35" border="0" title="Följ våran RSS"&gt;&lt;/a&gt;&lt;/td&gt;
  &lt;/tr&gt;
  &lt;/table&gt;&lt;/div&gt;
  &lt;/span&gt;
  
  
  &lt;/body&gt;
  &lt;/html&gt;
  
  
  * { margin:0;
  padding:0;
  }
  
  html {height: 100%;}
  
  body{
      position: relative;
      height: 100%;
      background: #fff;
  
  }
  
  
  
  /* Första boxarna*/
  ul.nav {
      list-style: none;
      display: block;
      width: 170px;
      position: relative;
      top: :0px;
      left: 10px;
      z-index:0;
      padding: 100px 0 50px 0;
      background: url(sh.png) no-repeat;
      -webkit-background-size: 50% 100%;
      display: list-item;
      font-family: OpenSans-Regular;
      font-size: 18px;
  
  }
  
  
  
  
  li {
      margin: 5px 0 0 0;
  }
  
  /* När jag drar musen över */
  ul.nav li a  {
      -webkit-transition: all 0.3s ease-out;
  
      color: #174867;
      padding: 7px 15px 7px 15px;
      -webkit-border-top-right-radius: 3px;
      -webkit-border-bottom-right-radius: 5px;
  
      display: block;
      text-decoration: none;
      -webkit-box-shadow: 2px 2px 4px 2px #888;
  }
  
  ul.nav li a:hover {
      background: #ebebeb url(border.png) no-repeat;
      color: #67a5cd;
      padding: 9px 15px 7px 30px;
  }
  ul.nav li ul { 
  display:none;
  }
  ul.nav li:active ul { 
  display:block;
  position:relative;
  left:3px;
  top:0px;
  list-style: none;
  z-index:999;
  background: #888;
  }
  
  ul.nav li ul li
  { 
  background:#888;
  
  }
  </code></pre>