> For the complete documentation index, see [llms.txt](https://felienne.gitbook.io/codasium/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://felienne.gitbook.io/codasium/module-4.2-javascript/les-6/les-6b.md).

# Les 6b

**Opdracht 1) Gekleurde invoer**

Ga naar [deze repl](https://replit.com/@mevrHermans/pidk-k4-m2-l6-opdracht-1). Je hebt een pagina met invoervelden en een knop. Zorg dat de knop de tekst van elk ingevoerd element rood kleurt.

Probeer dit zo kort mogelijk te doen. Je gebruikt natuurlijk ook `document.getElementsByClassName()`.

Daarnaast gebruik je ook een for-loop:

```javascript
for (let index = 0; index < lijst.length; index++){
}
```

**Opdracht 2) Random gekleurde invoer**

Ga naar [deze repl](https://replit.com/@mevrHermans/pidk-k4-m2-l6-opdracht-2). Neem het volgende array (lijst) op in je JavaScript bestand (en zet er extra kleuren in):

`var kleuren = ["red", "blue", "yellow"]`

Maak een aantal invoervelden waarin je woorden of een stuk tekst (naar eigen keuze) in kan vullen.

Geef alle invoervelden dezelfde **class**.

Maak dan een knop die elk ingevoerd element een andere kleur uit het kleurenarray geeft.

Probeer dit zo kort mogelijk te doen (denk aan kiezen uit een lijst van kleuren etc). Je gebruikt uiteraard ook `document.getElementsByClassName()`.

**Opdracht 3) Selecteer de tag**

Ga naar [deze repl.](https://replit.com/@mevrHermans/pidk-k4-m2-l6-opdracht-3)

Maak een HTML pagina met twee knoppen en wat *cursieve (=schuingedrukte)* en gewone text. Cursieve tekst maak je met de `<em>`-tag

Met knop 1 selecteer je alle cursieve woorden, en verander je de kleur.

Met knop 2 selecteer je alle cursieve woorden, en verander je de kleur terug.

Er staan wat hints voor de in de code om af te maken.