classes problem css

Question

I want to be able to just add a class called selected to the menu-button I think it's my css thats causing the problem this is what I have.

$('menu-button').addClass('selected');
div.mybutton {

}
div.mybutton .selected{
    background-color:#ff9900
}

My menu button also has children and I want to add a class called "selected" to the siblings. If i can do it this way it would be better than writing out seperate lines for each class name like "menu-button-over" where it could just be one "selected" i hope you can do it the way I want it to do but im sure its my css

I posted an answer but I just deleted it because I'm not sure if I understand what the problem is. Please clarify if you can. — morgar
– morgar, Commented May 2, 2011 at 1:48

Jeremy Battle · Accepted Answer · 2011-05-02 01:55:24Z

3

$('menu-button') isn't going to select anything, is menu-button the id? If so you need $('#menu-button')

Sounds like you want to do something like this:

<html>
  <head>
  <script type="text/javascript" src="http://code.jquery.com/jquery-1.5.2.js"></script>

  <style type="text/css">
    div.mybutton .selected{
    background-color:#ff9900
    }
  </style>

  <script type="text/javascript">
  $(document).ready(function(){
    $('.menu-button').hover(function(){ $(this).addClass('selected'); }, function(){ $(this).removeClass('selected'); });
  });
  </script>

</head>
<body>
  <div class="mybutton">
    <button class="menu-button">I'm a button 1</button>
    <button class="menu-button">I'm a button 2</button>
    <button class="menu-button">I'm a button 3</button>
</div>
</body>
</html>

demo here: http://jsfiddle.net/b2YJY/

edited May 2, 2011 at 1:55

answered May 2, 2011 at 1:49

Jeremy Battle

1,63813 silver badges18 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

ONYX Over a year ago

I was looking for answer not a critic

Jeremy Battle Over a year ago

How was I criticizing? Your selector was incorrect and your question wasn't that clear as morgar pointed out.

theabraham · Accepted Answer · 2011-05-02 01:51:20Z

1

Yeah, your CSS is going to go looking for a selected class that's a child of mybutton.

You could do this, though (credit to morgar):

div.mybutton.selected { background-color:#ff9900; }

answered May 2, 2011 at 1:51

theabraham

16.5k9 gold badges44 silver badges41 bronze badges

Collectives™ on Stack Overflow

classes problem css

2 Answers 2

2 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related