drop down menu Foundation JavaScript tigger

Question

I create simple drop down menu using Foundation 6

    <ul class="dropdown menu" data-dropdown-menu>
  <li>
    <a href="#">Item 1</a>
    <ul class="menu">
      <li><a href="#">Item 1A</a></li>

    </ul>
  </li>
  <li><a href="#">Item 2</a></li>
  <li><a href="#">Item 3</a></li>
  <li><a href="#">Item 4</a></li>
</ul>

Now i want to on different event ( like other button to hide or show menu.) But in doc there is no method to do this. When I use jquery trigger on click also not working is there any solution for this ?

Answer 1

Attach an event handler to an element (for example a button) and give it a function like hiding the dropdown menu:

 $("button").click(function(){$(".dropdown").hide()}) 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <ul class="dropdown menu" data-dropdown-menu> <li> <a href="#">Item 1</a> <ul class="menu"> <li><a href="#">Item 1A</a></li> </ul> </li> <li><a href="#">Item 2</a></li> <li><a href="#">Item 3</a></li> <li><a href="#">Item 4</a></li> </ul> <button> I'm a button </button> 

To allow it to come back again, try $("button").click(function(){$(".dropdown").toggle()})