DropDown duplo ativando ao inicar o projeto (HTML e JavaScript)

(Exemplo, estou fazendo assim)
<li class="button-dropdown">
	<a class="dropdown-toggle">
		Exemplo 1 <span>▼</span>
	</a>
	<ul class="dropdown-menu">
	<li>
	 <a href="">
	Sou o exemplo 1
	 </a>
	 </li>
	</ul>
 </li>
 
 <li class="button-dropdown">
	<a class="dropdown-toggle">
		Exemplo 2 <span>▼</span>
	</a>
	<ul class="dropdown-menu">
	<li>
	 <a href="">
	Sou o exemplo 2
	 </a>
	 </li>
	</ul>
 </li>
 
 
 (Meu CSS)
 
 .nav {
    

     font-size: 16px;  
  border: none;
  outline: none;
  padding: 14px 16px;

  font-family: inherit;
  margin: 0;
  border-radius: 10px;
   color: white;
   font-weight: bold;
   display: block;
}


.dropdown-toggle
{
  font-size: 16px;  
  border: none;
  outline: none;
  padding: 14px 16px;
 
  font-family: inherit;
  margin: 0;
  border-radius: 10px;
  color: white;
  font-weight: bold;
  position: all;
  cursor: pointer;

}
.dropdown-menu{
	padding-left: 20px;
}




<script>
		jQuery(document).ready(function (e) {
    function t(t) {
        e(t).bind("click", function (t) {
            t.preventDefault();
            e(this).parent().fadeOut()
        })
    }
    e(".dropdown-toggle").click(function () {
        var t = e(this).parents(".button-dropdown").children(".dropdown-menu").is(":hidden");
        e(".button-dropdown .dropdown-menu").hide();
        e(".button-dropdown .dropdown-toggle").removeClass("active");
        if (t) {
            e(this).parents(".button-dropdown").children(".dropdown-menu").toggle().parents(".button-dropdown").children(".dropdown-toggle").addClass("active")
        }
    });
    e(document).bind("click", function (t) {
        var n = e(t.target);
        if (!n.parents().hasClass("button-dropdown")) e(".button-dropdown .dropdown-menu").hide();
    });
    e(document).bind("click", function (t) {
        var n = e(t.target);
        if (!n.parents().hasClass("button-dropdown")) e(".button-dropdown .dropdown-toggle").removeClass("active");
    })
});
	</script>