JSFiddle - React, Tailwind, and code Playground

by Erik Woods

HTML

<label>Home Value<input data-qdc-home-value /></label>
<label>Another Value<input data-qdc-another-value /></label>
<label>Other Value<input data-qdc-other-value /></label>

<div class="assorted-values">
  <button data-qdc-tool="[data-qdc-home-value]">Home</button>
  <button data-qdc-tool="[data-qdc-another-value]">Another</button>
  <button data-qdc-tool="[data-qdc-other-value]">Other</button>
</div>

CSS

.assorted-values {
  margin: 1rem;
}

JavaScript

$('[data-qdc-tool]').on('click', function() {
  $($(this).data('qdcTool')).focus();
});