JSFiddle - React, Tailwind, and code Playground

by Bob Stein

HTML

<input id="one" data-custom-attribute="one" value="One">
<br>
<input id="two" data-custom-attribute="two" value="Two">
<br>
<input id="three" data-custom-attribute="three" value="Three">
<br>
<input id="four" data-custom-attribute="four" value="Four">

CSS

input[data-custom-attribute="red"] {
  color: red;
}

JavaScript

$("#one").prop("data-custom-attribute", "red");
$("#two").attr("data-custom-attribute", "red");
$("#three").data("custom-attribute", "red");