Cambiare class ad un elemento con id

[tarini]

ragazzi ho un selettore di questo tipo
div#linkbar ul li#backlink

ora però ho la necessità di assegnare all'elemento LI con id = backlink diverse classi in modo da modificargli l'aspetto a seconda di eventi precisi...

come faccio a creare il selettore??

ho provato con
div#linkbar ul li#backlink.on

ma non me lo prende...

sapete come posso fare??

[Mich_]

Qualsiasi modifica della pagina va realizzata tramite JS.
CSS da solo non e` sufficiente: puo` solo assegnare pseudoclassi in base ad eventi predefiniti (:hover, :active, :visited, :focus).

Quindi prima di procedere devi verificare se i tuoi eventi rientrano tra quelli previsti dalle pseudoclassi.

Ora una nota sul tuo selettore:
div#linkbar ul li#backlink
significa: il tag <li id="backlink"> contenuto dentro un <ul> a sua volta contenuto nel tag <div id="linkbar">
Dato che gli id devono essere univoci nel documento (pagina), il selettore stesso e` assolutamente equivalente a:
#backlink

Per assegnare una classe ad un oggetto, l'istruzione JS e`:
document.getElementById('ID_OGGETTO').className = 'CLASSE';
dove la classe deve essere preventivamente definita nello stile.

[tarini]

grazie per la risposta, ma non mi hai detto niente che già non sapevo

il mio problema è questo:

ho un menu composto da una lista, quindi con tanti elementi LI

ogni elemento ha un suo id per identificare il tipo di menu, in quanto ciascun LI ha condizioni particolari. Ora supponiamo che a seguito di un evento (sicuro JS!) questo elemento LI deve subire delle variazioni. Avevo pensato, invece che impostare lo style programmaticamente tramite js, di creare delle classi "PROPRIE" per quel LI e impostargli la classe (sempre e solo con JS!). Tutto questo deriva dal fatto che per esempio la classe di nome "on" ha comportamenti diversi se viene applicata a LI con id diverso... spero di essere stato chiaro :P...

Non so però come impostare il selettore che traduca "la classe ON disponibile SOLO per l'elemento con id MENU1".

Forse è proprio sbagliato concettualemente in quanto la classe di natura non può essere propria di un LI ma è disponibile a tutti gli elementi della pagina.

l'unica alternativa valida che ho trovato è questa

//CSS
ul#menu li#menu1 {
  /* caratteristiche base */
}
li.menu1_on {
  /* caratteristiche menu "acceso" */
}
li.menu1_off {
  /* caratteristiche menu "spento" */
}

//JS
elemento.onEventoDecisoDaMe = function() {
  elemento.className = "menu1_off";
}
element.onAltroEventoDecisoDaMe = function() {
  elemento.className = "menu1_on";
}

Cosi funziona perfettamente...

la mia ora è solo pura curiosità.

[Mich_]

Tieni presente che menu a cascata se ne possono fare diversi, usando solo CSS: ne trovi tra i "link utli" - sezione menu (ma non so se e` applicabile al tuo caso).

Tieni presente che si possono applicare piu` classi ad uno stesso oggetto:
<tag id="ID_OGG" class="CLASSE1 CLASSE2">

Assegnare una classe via JS sovrascrive le propreta` precedenti, non le elimina (cioe` una proprieta` non definita nella nuova classe rimane definita dalla classe/id precedente)

Fatte queste premesse, devo dire chenonho ben capito il tuo problema.
Probabilmente devi crearti varie calssi, da assegnare ai vari oggetti.

Quello che NON si puo` fare, e` usare una classe che si comporti in modo diverso a seconda del contesto o dell'id dell'oggetto: invece devi assegnare la classe corretta.

Pero` puoi agire via JS:
document.getElementById(ID_OGG).className = "CLAS"+variabile;
dove la variabile e` definita dal contesto (JS).
In tal caso puoi prepararti le varie classi:
.CLASpippo
.CLASpluto
.CLAStopol