Gibt es eine Möglichkeit, das CSS für eine Klasse zu ändern, wenn Sie den Mauszeiger über ein Element einer anderen Klasse bewegen, das nur CSS verwendet?

So etwas wie:

<code>.item:hover .wrapper { /*some css*/ }
</code>

Nur 'wrapper' ist nicht in 'item', sondern irgendwo anders.

Ich möchte wirklich kein Javascript für so etwas Einfaches verwenden, aber wenn ich muss, wie würde ich es tun? Hier ist mein gescheiterter Versuch:

<code>document.getElementsByClassName('item')[0].onmouseover="document.getElementsByClassName('wrapper')[0].style.background="url('some url')";";
</code>

Es gibt nur ein Element in jeder Klasse. Ich weiß nicht, warum sie bei der Erstellung der Vorlage keine IDs verwendet haben, aber so ist das und ich kann es nicht ändern.

[Bearbeiten]

Es ist ein Menü. Jedes Menüelement hat eine eigene Klasse. Wenn Sie mit der Maus über das Element fahren, wird rechts ein Untermenü eingeblendet. Es ist wie bei einer Überlagerung, wenn ich das Tool "Inspect Element" verwende und sehe, dass sich die gesamte HTML-Website ändert, wenn das Untermenü aktiv ist (dh, es gibt nur das Untermenü). Die Klasse, die ich "Wrapper" nenne, enthält die CSS, die den Hintergrund für das Untermenü steuert. Es gibt wirklich keine Verbindung, die ich zwischen den beiden Klassen sehen kann.