JSFiddle - React, Tailwind, and code Playground

HTML

<ul class="effects-list">
    <li data-creative="1">Creative</li>
    <li data-uplifted="3">Uplifted</li>
    <li data-energetic="3">Energetic</li>
</ul>

JavaScript

$(function() {

var effectData = $('.effects-list li');
var creative = effectData.data("creative");
var uplifted = effectData.data("uplifted");
var energetic = effectData.data("energetic");


console.log(creative);
console.log(uplifted);
console.log(energetic);
    
});