# Textfarbe per button ändern



## Leoloewe (26. Nov 2020)

Hallo,
ich würde gerne die Textfarbe einer ul list per Button ändern lassen. Leider fehlt mir hier die passende Funktion.

<button type="button" onclick=?????>Drück mich!</button>

Sollte der Button gedruckt werden soll die Textfarbe sich auf Blau ändern.


----------



## Flown (26. Nov 2020)

Das funktioniert mittels JavaScript und das hier ist ein Java Forum.

Aber um dir die Lösung zu verraten: Du suchst aus dem DOM deine Elemente, setzt direkt ein style attribut oder gibst denen eine css klasse mit deiner gewünschten Farbe


----------



## Leoloewe (26. Nov 2020)

Flown hat gesagt.:


> Das funktioniert mittels JavaScript und das hier ist ein Java Forum.
> 
> Aber um dir die Lösung zu verraten: Du suchst aus dem DOM deine Elemente, setzt direkt ein style attribut oder gibst denen eine css klasse mit deiner gewünschten Farbe


Danke für deine Antwort. Der Text besitzt bereits mehrere css klassen. Der Button soll bewirken, dass diese überschrieben werden und alle gemeinsam eine gemeinsame farbe haben.


----------



## krgewb (26. Nov 2020)

Schreib doch eine eigene Funktion.

Dazu schreibst du

```
<button type="button" onclick=meineSupercooleFunktion()>Drück mich!</button>
```
Und dann:

```
<script type="text/javascript">	 	
			
    function meineSupercooleFunktion(){
        // TODO
    }

</script>
```


----------



## Leoloewe (26. Nov 2020)

krgewb hat gesagt.:


> Schreib doch eine eigene Funktion.
> 
> Dazu schreibst du
> 
> ...


So weit war ich auch schon, allerdings habe ich keine Ahnung wie die Funktion aussehen könnte


----------



## MoxxiManagarm (26. Nov 2020)

```
<div id="myText" class="red-text">Super cooler Text, der ursprünglich rot ist.</div>
<button type="button" onclick="document.getElementById('myText').style.color = 'blue'">Drück mich für blauen text!</button>
```

(https://stackblitz.com/edit/js-cekhvc?file=index.html)


----------



## krgewb (26. Nov 2020)

Auf diese Weise kannst du den Text mit der ID myText blau machen.

```
var m = document.getElementById("myText");
m.style.color = "blue";
```
Wenn du eine class verwendest, must du getElementsByClassName() verwenden. Das ist aber dann ein Array.
Aber du musst es nochmal anders machen, da du ul umfärben willst. Ich weiß gerade nicht, wie man das macht.

Es gibt in css drei Sachen:
- Tags wie z.B. ul. Der Name steht einfach so in der CSS-Datei.
- Klassen. Bei diesen steht ein Punkt vor dem Namen.
- IDs. Bei diesen steht ein Rautezeichen vor dem Namen.


----------

