JSFiddle - React, Tailwind, and code Playground

by Christoph

HTML

<form id="css" action="changecss.php" method="POST">
<table>
<tr>
<td>
which one do you want to change :
</td>
<td>
<select id="element" name="thecolorselect">
<option value="body">Background</option>
<option value="a">Achor</option>
<option value="p">Paragraph</option>
</select>
</td>
<td>
Current attributes:
</td>
<td>
<select id="attr" name="attr">
<!-- here will be listed the current attributes of the item -->
    <option value="background-color">Backgroundcolor</option>
</select>
</td>
<td>
Change into:
</td>
<td>
<select id="color" name="thecolorinput">
<option value="red">Red</option>
<option value="blue">Blue</option>
<option value="yellow">Yellow</option>
</select>
</td>
</tr>
</table>
<button name="changecsspropertynow">Change the background color now</button>
</form>

<p>Paragraph</p>
<a href="#">Anchor</a>

JavaScript

$("#css").on("submit",function(e){
    e.preventDefault();
    element = $("#element").val();
    console.log(element);
    attr = $("#attr").val();
    console.log(attr);
    color = $("#color").val();
    console.log(color);
    $(element).css(attr,color);
});