JSFiddle - React, Tailwind, and code Playground

by David Thomas

HTML

<div id="div" data-change-me='blue'>
    <p>A div, with a custom attribute of 'data-change-me' set to 'blue' on page-load. (Converted to 'red' with JavaScript.)</p>
</div>

CSS

#div::before {
    content: "'data-change-me' set to: " attr(data-change-me);
    display: block;
    border-bottom: 3px solid #f90;
    }

JavaScript

var selector = document.getElementById('div');
selector.setAttribute('data-change-me','red');