title: HTML/jQuery on click show/hide ul ul
body: <p>I have this HTML code</p>
  
  <pre><code>&lt;ul&gt;
      &lt;li&gt;&lt;a href="#"&gt;link&lt;/a&gt;
        &lt;ul&gt;
          &lt;li&gt;&lt;a href="#"&gt;link&lt;/a&gt;&lt;/li&gt;
          &lt;li&gt;&lt;a href="#"&gt;link&lt;/a&gt;&lt;/li&gt;
          &lt;li&gt;&lt;a href="#"&gt;link&lt;/a&gt;&lt;/li&gt;
        &lt;/ul&gt;
      &lt;/li&gt;
  
      &lt;li&gt;&lt;a href="#"&gt;link&lt;/a&gt;
        &lt;ul&gt;
          &lt;li&gt;&lt;a href="#"&gt;link&lt;/a&gt;&lt;/li&gt;
          &lt;li&gt;&lt;a href="#"&gt;link&lt;/a&gt;&lt;/li&gt;
          &lt;li&gt;&lt;a href="#"&gt;link&lt;/a&gt;&lt;/li&gt;
        &lt;/ul&gt;
      &lt;/li&gt;
  
    &lt;/ul&gt;
  </code></pre>
  
  <p>now I want -> hide all sub menus -> if I click to main li element -> show current li's sub menu and next if I click to another main li element show sub menu and hide previously displayed sub menu.</p>
  
  <p>Can anyone help me?</p>