Question

I have the following javascript code which changes the class (of the <ins> tag) for each selected node in the jstree:

   $j("#actionButton1").click(function() {

      $j.each($j("#demo2").jstree("get_selected"), function(index, element) {

      alert($j(element).attr('id'));

      var sub_id = $j(element).attr('id'); //node id is stored in the varialble sub_id

      $j("#"+sub_id+" ins:eq(1)").attr("class","jstree-icon2"); // set class to display new icon

   });//end of selected nodes loop
});

The code above works fine except for one thing, if the selected sub_id exists in more than one place in the tree, the class to display a new icon does not seem to work.

I believe i have loop through the jstree to search for all occurences of the sub_id and then associate the new class to the nodes.

Any hint on how to do that is most welcomed.

Thanks a lot.

Answer 1

When you use the # id selector it will only return the first element. Adding sub_id to a name or class attribute should help you with your problem. As i mentioned in the comment, the id attribute should be unique on the page.

You will also want to remove the :eq(1) from your selector if you want to apply the class to all matching elements and not just the second. :eq accepts a 0 based index.

Edit

Your new selector:

$j("your-element[name='"+sub_id+"' ins").attr("class","jstree-icon2");