CODEWITHSUNDEEP
jquery
qqruza
qqruza

Reputation: 1417

add a first character of text to css

I got a challenging task here and really hope that you can help me.

I am taking the info from json feed by ajax and want to add only first character of my item.title as content css attribute to the #list > .item:before

 var str = item.title;
 $('#list > .item:before').attr('content', str.substring(0,1));

But for some reason it doesn't work. Please advise me a line of code how to make it happen.

Thanks a lot in advance.

Upvotes: 0

Views: 72

Answers (2)

user2417483
user2417483

Reputation:

Why not just use CSS :first-letter to control the output? https://developer.mozilla.org/en-US/docs/Web/CSS/::first-letter

Upvotes: 0

freejosh
freejosh

Reputation: 11383

You can't change pseudo-classes with jQuery.

I'd suggest simply prepending it as a span:

$('#list > .item').prepend('<span>' + str.substring(0,1) + '</span>');

And, assuming you have other CSS that's targeting the :before to style it, change the CSS selector to #list > .item > span

Upvotes: 2

Related Questions