JSFiddle - React, Tailwind, and code Playground

HTML

<div id="theDiv" data-test1="{string: 'test 1 data'}"></div>

CSS

.thisClass {
    width:50px;
    height:50px;
    background-color:red;
}
.thatClass {
    width: 50px;
    height:50px;
    border: 20px solid yellow;
}

JavaScript

$(document).ready(function () {
    var div = $("#theDiv"),
        obj = {val2: "val1", val2: "val2"};
    
    div.data(["test1"]["number"], 1);
    
    
    div.data("test2", div.data("test2") || [0,1,2]); //leave test2 as is or make an array
    
    
    console.log(div.data());
    
});