JSFiddle - React, Tailwind, and code Playground

HTML

<div id="data" data-idata="[1,2,3]" data-sdata="['foo', 'bar', 'baz']"></div>

<div id="out">by eval</div>
<div id="out1">by JSON.parse</div>
<div id="out2">by $.parseJSON</div>
<div id="out3">int data</div>

JavaScript

function out(id, o)
{
    var ul = $("<ul>");
    for (var key in o)
    {
        ul.append($("<li>").text(key + " -> " + o[key]));
    }
    $(id).text(o).append(ul);
}

var $data = $("#data").data(),
    values;

// use eval
out("#out", eval($data.sdata));

// use JSON.parse
try
{
    values = JSON.parse($data.sdata);
} catch(e) {
    // silent catch
}
out("#out1", values);

// use $.parseJSON
try
{
    values = $.parseJSON($data.sdata);
} catch(e) {
    // silent catch
}
out("#out2", values);

// directly write properly formatted integer data
out("#out3", $data.idata);