JSFiddle - React, Tailwind, and code Playground

by jimp

HTML

<form>
  <div>
    <select name="control1">
        <option value="1">Select 1, Option 1</option>
        <option value="2">Select 1, Option 2</option>
        <option value="3">Select 1, Option 3</option>
        <option value="4">Select 1, Option 4</option>
        <option value="5">Select 1, Option 5</option>
    </select>
  </div>
  <div>
    <select name="control2">
        <option value="1">Select 2, Option 1</option>
        <option value="2">Select 2, Option 2</option>
        <option value="3">Select 2, Option 3</option>
        <option value="4">Select 2, Option 4</option>
        <option value="5">Select 2, Option 5</option>
    </select>
  </div>
  <div>
    <select name="control3">
        <option value="1">Select 3, Option 1</option>
        <option value="2">Select 3, Option 2</option>
        <option value="3">Select 3, Option 3</option>
        <option value="4">Select 3, Option 4</option>
        <option value="5">Select 3, Option 5</option>
    </select>
  </div>
</form>
<div id="output" />

CSS

div
{
    margin: 1em;
}

JavaScript

jQuery(document).ready(function ($) {
    $('select').change(function (e) {
        var $this = $(this);
        $('#output')[0].innerHTML += '<div>'+$this.attr('name')+' = '+$this.val();
    });
});