Get Element ID - JavaScript

Question

I know the data-id from the li element, but now i want the id value of the li element. How can I get this? Tried:

 var id = $('li[data-id="KnSubject[StId]"]').id;
 console.log(id); // UNDEFINED

Html Code:

<li role="treeitem" data-jstree="{&quot;icon&quot; : &quot;glyphicon glyphicon-pencil&quot;}" data-id="KnSubject[StId]" data-values="null" aria-selected="true" aria-level="3" aria-labelledby="j1_4_anchor" id="j1_4" class="jstree-node  jstree-leaf"><i class="jstree-icon jstree-ocl" role="presentation"></i><a class="jstree-anchor jstree-clicked" href="#" tabindex="-1" id="j1_4_anchor"><i class="jstree-icon jstree-themeicon glyphicon glyphicon-pencil jstree-themeicon-custom" role="presentation"></i>Type dossieritem (StId)</a></li>

Answer 1

var id = $('li[data-id="KnSubject[StId]"]').attr('id');
console.log(id);

Answer 2

Use attr function.

var elem = $('li[data-id="KnSubject[StId]"]');
console.log(elem.attr('id'));

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<li role="treeitem" data-jstree="{&quot;icon&quot; : &quot;glyphicon glyphicon-pencil&quot;}" data-id="KnSubject[StId]" data-values="null" aria-selected="true" aria-level="3" aria-labelledby="j1_4_anchor" id="j1_4" class="jstree-node  jstree-leaf"><i class="jstree-icon jstree-ocl" role="presentation"></i><a class="jstree-anchor jstree-clicked" href="#" tabindex="-1" id="j1_4_anchor"><i class="jstree-icon jstree-themeicon glyphicon glyphicon-pencil jstree-themeicon-custom" role="presentation"></i>Type dossieritem (StId)</a></li>

Answer 3

Just for completeness reasons:

$('li[data-id="KnSubject[StId]"]').get(0).id

.get(0) retrieves the raw JS DOM Element.