简体   繁体   中英

jQuery not selecting div class

Trying to make a simple toggle menu, and I can't seem to hide/show the sub menu using this bit of jQuery:

$(".topic news").mouseup(function(){
    $(".feed groups").hide("fast", function(){
      $(".feed messages").hide("fast");
      $("ul.feed news").toggle("fast");
    });
  });

Here is the corresponding HTML:

<div class="topic news">
  <span>News Feed</span>
 </div>
 <ul class="feed news">
  <li>News item #1</li>
  <li>News item #1</li>
  <li>News item #1</li>
  <li>News item #1</li>
  <li>News item #1</li>
 </ul>

Any ideas?

To select a div with multiple classes, whether in CSS or jQuery, you concatenate multiple class selectors:

// Notice the dot instead of the space in all these selectors
$(".topic.news").mouseup(function(){
    $(".feed.groups").hide("fast", function(){
      $(".feed.messages").hide("fast");
      $("ul.feed.news").toggle("fast");
    });
});

No effects will get fired as there is no html that has classes feed and groups

$(".feed.groups").hide("fast", function(){

unless you've omitted that.

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM