jQuery切换不起作用

Question

我正在尝试为移动设备创建一个切换菜单，但我遇到了一个非常奇怪的问题。我的主菜单工作得很好，第一个子菜单也没有，但第二个子菜单没有完全切换，代码与第一个子菜单相同。

＆＃13;

＆＃13;

$(document).ready(function(){
  $(".menu").click(function(){
    $("ul").toggleClass("dropdown");
  });
});

$(document).ready(function(){
  $("#dd").click(function(){
    $("#d ul li").toggleClass("dropdown");
  });
});

(document).ready(function(){
  $("#tt").click(function(){
    $("#t ul li ").toggleClass("drop1");
  });
});

＆＃13;

.dropdown {
  display:block
}

.drop1{
  display:block
}


div a {
  text-decoration: none;
  color: white;
  font-size: 20px;
  padding: 10px;
  display:inline-block
}

ul {
  list-style-type:none;
  display:none;
  margin: 0;
  padding: 0;
}

ul li {
  background:#555;
  height:50px;
  position:relative;
}

ul li a {
  width:100%;
}

ul li ul li {
  width:150px;
  display:none;
  position:absolute;
  left:80px;
  top:0px;
  z-index: 1;
  background: #555; 
}


ul li ul li a {
  width:100%;
} 

＆＃13;

 <!-- Latest compiled and minified CSS -->
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha512-dTfge/zgoMYpP7QbHy4gWMEGsbsdZeCXz7irItjcC3sPUFtf0kuFbDz/ixG7ArTxmDjLXDmezHubeNikyKGVyQ==" crossorigin="anonymous">

<!-- Optional theme -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap-theme.min.css" integrity="sha384-aUGj/X2zp5rLCbBxumKTCw2Z50WgIr1vs/PFN4praOTvYXWlVyh2UtNUU0KAUhAX" crossorigin="anonymous">

<!-- Latest compiled and minified JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js" integrity="sha512-K1qjQ+NcF2TYO/eI3M6v8EiNYZfA95pQumfvcVrTHtwQVDG+aHRqLi/ETn2uB+1JqwYqVG3LIvdm9lj6imS/pQ==" crossorigin="anonymous"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div class="nmobile">
<div class="col-xs-4">
<a href="#" class="menu">
<img src="23799.png" height="40px" width="30px">
 </a>

 <ul><li>
 <a href="#" id="dd">join us</a>
<div id="d">
       <ul >
        <li><a href="#">Link 1</a></li>
        <li><a href="#">Link 2</a></li>
        <li><a href="#">Link 3</a></li>
      </ul> </div>
 </li></ul>


 <ul><li>
 <a href="#" id="tt">join uss</a>
 <div id="t">
       <ul>
        <li><a href="#">Link1 1</a></li>
        <li><a href="#">Link2 2</a></li>
        <li><a href="#">Link3 3</a></li>
      </ul> </div>
 </li></ul>

 
  </div>
</div>

＆＃13;

＆＃13;

＆＃13;