CODEWITHSUNDEEP
jqueryhtmlthiscustom-data-attribute
JZ.
JZ.

Reputation: 21897

Getting the values of HTML Data attributes with Jquery

I have a click function that passes the following dom as this:

<span class="tcloud label label-large label-primary" data-c="1" data-n="environment">
                        environment
                      </span>

How can I use jquery to select for the values of the html5 data attributes?

$(document).ready(function() { 
  $('span.tcloud').click(

  function () {
  console.log(this) // returns the above dom
  console.log($(this)) // returns an error
  console.log(this.data("data-c")) // returns Uncaught TypeError: Object #<HTMLSpanElement> has no method 'data'

Upvotes: 0

Views: 1166

Answers (2)

Muneeb Nasir
Muneeb Nasir

Reputation: 2504

you can get the value by using its id in following way. 

 $('span.tcloud').click(

  function () {
      console.log( $('#element').val());
 }

Upvotes: 0

user1721135
user1721135

Reputation: 7092

Personally, I simply use 

var values = $("element").attr("data-c");

Upvotes: 1

Related Questions