Как задать св-во элементу из массива?

Question

[Ingernirated]

Хотел сделать первую букву красного цвета, но что-то пошло не так.

<p class="try">SLIDER</p>
<script>
function changeColor() {
	var z = document.querySelector(".try").innerHTML;
	z[0].style.color = "red";
}
document.body.onclick = changeColor;
</script>

Answer 1

[Златослав Десятников]

Уберите innerHTML. Это свойство содержит HTML-код, это не массив.

UPD: криво прочитал вопрос. Псевдоэлемент ::first-letter поможет вам.

Comments

[Ingernirated]

Как его применить в js?
поисковик только в css о нём выдает.

[Ingernirated]

Вообще хотелось бы не только с первой буквой такое провернуть, это возможно?

[Златослав Десятников]

Ingernirated: только если разбивать слово на буквы.

А чтобы использовать в JS, сделайте класс в CSS и в JS вешайте класс на элемент — это хорошая практика.

[Златослав Десятников]

Ingernirated: вот так:

<span>б</span><span>у</span><span>к</span><span>в</span><span>ы</span>

Answer 2

[Антон]

Используйте для этого css псевдоэлемент::first-letter

Comments

[Ingernirated]

Как его применить в js?
поисковик только в css о нём выдает.

[Антон]

Ingernirated: в css и делать, если нужно раскрасить букву. Если же нужно изменить цвет произвольной буквы, то каждая буква должна быть обёрнута в DOM элемент, например, span

Answer 3

[romy4]

фактичски, вот с этого места другой алгоритм
var z = document.querySelector(".try").innerHTML;
теперь заменяете первую букву на S и возвращаете всё в innerHTML