Почему находит только первый элемент из 4х?

Question

[Влад ~]

у меня есть 4 элемента с атрибутом height

<div class="statistics-diagram-grafi">
					<div class="statistics-diagram-grafi__item" height="10"></div>
					<div class="statistics-diagram-grafi__item" height="20"></div>
					<div class="statistics-diagram-grafi__item" height="60"></div>
					<div class="statistics-diagram-grafi__item" height="70"></div>
  		</div>

и скрипт

$(document).ready(function() {
	var val = $('.statistics-diagram-grafi__item').attr('height');
	console.log(val);
	$('.statistics-diagram-grafi__item').css('height',val+'%');
});

почему находит только первый элемент ? подскажите пожалуйста

Answer 1

[hzzzzl]

находит все, но с каждым из них произвести операцию надо по отдельности через .each
https://api.jquery.com/each/

$('.statistics-diagram-grafi__item').each( (index, item) => {
  // вот здесь у item ставим css height
} )

Comments

[Влад ~]

Подскажите пожалуйста
что я сделал не так

$(document).ready(function() {https://toster.ru/#
		$('.statistics-diagram-grafi__item').each(function(index, item){
		$(this).css('height',+ $('.statistics-diagram-grafi__item').attr('height')+'%')
	});
});

опять берет значение с первого элемента и ставит его всем

[hzzzzl]

Влад ~, в любой непонятной ситуации ставь console.log :)

.each(function(index, item) { ... }) --- здесь каждый элемент будет item, а this я не знаю что будет,
скорее всего надо

$('.statistics-diagram-grafi__item').each(function(index, item){
  let div = $(item)  // чисто для удобства чтения
  div.css('height',+ div.attr('height')+'%')
});

но я не очень умею в джквери, если не выйдет так, то надо смотреть что именно выдает в console.log(this, item, $(item))

[Влад ~]

hzzzzl, спасибо большое все работает