JSFiddle - React, Tailwind, and code Playground

HTML

<div id="foo"></div>
<pre id="log"></pre>

JavaScript

var f=$("#foo");

f.attr("data-bar","baz");
_conout(f.data("bar"))
f.attr("data-bar","boom");
_conout(f.data("bar"))
f.data("bar","woom");
_conout(f.data("bar"))

var s1=$("div[data-bar='baz']");
var s2=$("div[data-bar='boom']");
var s3=$("div[data-bar='woom']");

_conout(s1.length);
_conout(s2.length);
_conout(s3.length);
function _conout(msg){
    var l=$("#log")
    l.html(l.html()+msg+"\n");
}