scoping html data with js or jquery

Question

This is my html ( in twig template )

<li id="{{folder.id}}" data-jstree='{"icon":"glyphicon glyphicon-tags", "type":"folder"}' ><a href="#">{{folder.name}}</a>

I am trying to get the value of 'type' from 'data-jstree'.

I tried using

var node_id = ref.get_node(sel[i]).id;
var type = $("#"+node_id).attr("data-jstree");

but that gives me this : {"icon":"glyphicon glyphicon-tag", "type":"tag"} and i only need the value of type.

Thanks in advance.

Answer 1

var type = JSON.parse($("#"+node_id).attr("data-jstree")).type

Answer 2

you need to parse the string into json. do something like this:

var node_id = ref.get_node(sel[i]).id;
var type = $("#"+node_id).attr("data-jstree");
type = JSON.parse(type).type;