Add a dropdown function to existing menu : I need to add a dropdown option to existing menu bar,  here is my css and html code.

I found a lot of dropdown menus, but i's very important to me that i just add that function, not to change whole menu.

<!-- begin snippet: js hide: false console: true babel: false -->

<!-- language: lang-css -->

    /* Add a black background color to the top navigation */
    .topnav {
        background-color: #333;
        overflow: hidden;
    }

    /* Style the links inside the navigation bar */
    .topnav a {
    	float: left;
    	display: block;
    	color: #f2f2f2;
    	text-align: right;
    	padding: 14px 16px;
    	text-decoration: none;
    	font-size: 17px;
    }

    /* Change the color of links on hover */
    .topnav a:hover {
        background-color: #ddd;
        color: black;
    }

    /* Add a color to the active/current link */
    .topnav a.active {
        background-color: #4CAF50;
        color: white;
    }

<!-- language: lang-html -->

    <div class="topnav" id="myTopnav">
     
      <a href="#news">Speed Dial</a>
      <a href="#news">Speed Dial</a>
     

<!-- end snippet -->

