JSFiddle - React, Tailwind, and code Playground

by basiclaser

HTML

<div class="output">
    <input class="input" value="green"></input>
</div>
<div class="output">
    <input class="input" value="turquoise"></input>
</div>
<div class="output">
    <input class="input" value="blue"></input>
</div>

CSS

.output {
    margin: 5px;
    padding: 5px;
    background: turquoise;
}

JavaScript

var input = document.getElementByClass("input");
var output = document.getElementByClass("output");
var theColour = input.value;
for (i = 0; i <= input.length; i++) {
    output[i].style.backgroundColor = theColour[i];
}

input.on(change){
    event.preventDefault();
    this.parent.style.backgroundColor = textinput;
}