Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

JavaScript

Posted by Tushar Singh
Tushar Singh
Courses Plus Student 8,692 Points

Please help!!!!!!

http://codepen.io/tushar_13/pen/ZWvOwg

I tried many things and none of them worked. I want that if i click the online button, only show that channels which are currently streaming and same is the case with the offline button.

Please can someone take a look at my code in codepen and suggest what should I do.

Thanks!

6 Answers

Samuel Key
Samuel Key
3,310 Points

I messed around with your codepen a bit. Give this a try:

    // working on buttons    
   $('#online').click(function(){
    $('#main-section li').each(function() {
       if($(this).find($('span')).hasClass('online')){
         $(this).show();
        }else {
         $(this).hide();
        }
      })
   });

        $('#offline').click(function(){
    $('#main-section li').each(function() {
       if($(this).find($('span')).hasClass('offline')){
         $(this).show();
        }else {
         $(this).hide();
        }
      })
   });

I think that accomplishes what you are looking for.

Tushar Singh
PLUS
Tushar Singh
Courses Plus Student 8,692 Points
Tushar Singh
Tushar Singh
Courses Plus Student 8,692 Points

I figured it out but your answer is kinda better and short basically Mine--

 $('#all').click(function() {
       $('.sub-section').css('display', 'block');
     });
     $('#offline').click(function(){
     $('.sub-section:contains("Online")').css('display', 'none');
     $('.sub-section:contains("Offline")').css('display', 'block');
   });       
   $('#online').click(function(){
     $('.sub-section:contains("Offline")').css('display', 'none');
     $('.sub-section:contains("Online")').css('display', 'block');
   });
Tushar Singh
Tushar Singh
Courses Plus Student 8,692 Points

Thanks man and you should post your answer in the answer section, not as a comment. Now I can't choose your answer as the best answer.

Samuel Key
Samuel Key
3,310 Points

Oops, I always do that

Steven Parker
Steven Parker
243,656 Points
Steven Parker
Steven Parker
243,656 Points

I couldn't tell that the buttons were doing anything right now. So I added click handlers to them:

// this goes in the "ready" area:
  $("#all").click(function() {
    $("span.online,span.offline").parents("li").show();
  });

  $("#offline").click(function() {
    $("span.online").parents("li").hide();
    $("span.offline").parents("li").show();
  });

  $("#online").click(function() {
    $("span.offline").parents("li").hide();
    $("span.online").parents("li").show();
  });
});
Tushar Singh
Tushar Singh
Courses Plus Student 8,692 Points

Oh ya parents, I should have thought of that. Thanks bro again. You saved my ass twice. ;)

Steven Parker
Steven Parker
243,656 Points
Steven Parker
Steven Parker
243,656 Points

Heh, I got distracted while I was composing that. I see while I was doing it you got a somewhat similar answer, but with interesting differences. Just goes to show how much variation you can have in programming.

Tushar Singh
PLUS
Tushar Singh
Courses Plus Student 8,692 Points
Tushar Singh
Tushar Singh
Courses Plus Student 8,692 Points

Thanks again. Here I have noticed that people do not answer your questions. They just want to answer those stupid and super easy challenges. I really appreciate your help. I was stuck for a long time, I am not aware of this "find"; I'll look into it.

Samuel Key
Samuel Key
3,310 Points

Sure thing! Looks like a cool site you're building.

Steven Parker
Steven Parker
243,656 Points
Steven Parker
Steven Parker
243,656 Points

I actually enjoy the more challenging questions (assuming it's *technically" challenging :bulb:, not one of those that are just hard to understand! :stuck_out_tongue_winking_eye:).

Tushar Singh
PLUS
Tushar Singh
Courses Plus Student 8,692 Points
Tushar Singh
Tushar Singh
Courses Plus Student 8,692 Points

Haha me too, I'm in love with programming. Everything is logical and makes sense. Challenges are actually fun that's why I chose to do something on my own rather than just watching videos and solving their super easy and dumb questions.

I think we will definitely meet on the forum again. Now I think I understand how to work with an api and it's time to move up the ladder.

Weather Api

Wiki Api

Next thing on my list is a javascript calculator.

Samuel and Steven I think I will bug you again :p

Tushar Singh
PLUS
Tushar Singh
Courses Plus Student 8,692 Points
Tushar Singh
Tushar Singh
Courses Plus Student 8,692 Points

Please head over to this page

https://teamtreehouse.com/community/a-little-problem-with-objects