CODEWITHSUNDEEP
javascriptjquery
Myoji
Myoji

Reputation: 279

Set DIV height for each by it's data-attribute

I am trying to loop through over each div that has a class of block and set it's height individually based on it's data-attribute data-height

HTML

<div class="block" data-height="300"></div>
<div class="block" data-height="500"></div>
<div class="block" data-height="700"></div>

jQuery

$('.block').each(function(){ 
    var size = $this.attr('data-height');
    $(this).height(size);
});

JS Fiddle http://jsfiddle.net/MLnBY/166/

It's not returning the height when I have it in the each method though thus not setting the height for each one.

Upvotes: 3

Views: 2604

Answers (3)

nehal gala
nehal gala

Reputation: 131

Hey you can do it using pure javascript like this: 

var size = this.getAttribute('data-height');

Upvotes: 1

ventsi.slav
ventsi.slav

Reputation: 332

You forgot the () on the second line of JS at $(this)

Upvotes: 2

nicael
nicael

Reputation: 19005

The problem is in $this; replace it with $(this)

var size = $(this).attr('data-height');

Upvotes: 5

Related Questions