This is related to naming conventions for a DOM element\'s id attribute and I guess the name attribute as well. When it comes to JavaScript, from what I understand and have done
Naming as few objects as possible definitely helps keep things clean. If you can get by naming the parent and just referring to the child, that's going to be better (in my opinion). You get the bonus of slightly less html rendered to the client on each page.
For when I do have to name elements though, I prefer all lowercase, with underscore notation. I've been tricked up by not getting my case right in CSS files before, so if I can count that out as a problem early, that's as relief.
Underscores are characters while dashes can be interpreted as minus's, so that's one more potential problem - makes sense to stick with underscores only. Flex, for instance, doesn't accept XML with attributes named with dashes (i know these are values not attributes; but still a safe bet).
I agree with above though -- no element types or positioning or color as a class/id. Hungarian notation == bad. Very useful to determine what's an ID. I like naming form fields in a object specific ways - user_login, user_email, user_address_state_id, user_address_country_id
etc, might all show up on a user registration form. Usually non-form fields aren't long enough for underscores, otherwise you might be able to rename them.