HTML store value into div and get its value

Question

I have a div like

<div class="firstclass" id="first" data-value="firstvalue">SomeThing</div>

Here I want to get the value in data-value like by doing document.getElementById('first').value or something like this..

How can I get this value or if there is similar approach

Answer 1

Use .attr() or .getAttribute(). That would work.

jQuery Solution

$(function(){
  console.log($('#first').attr('data-value'));
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="firstclass" id="first" data-value="firstvalue">SomeThing</div>

JavaScript Solution

function Example(){
  console.log(document.getElementById('first').getAttribute("data-value")); 
}
Example();

<div class="firstclass" id="first" data-value="firstvalue">SomeThing</div>