CODEWITHSUNDEEP
jquery
Takeshi Patterson
Takeshi Patterson

Reputation: 1277

How can I change the text of an element but maintain CSS styling in Jquery?

I am trying to replace the text of a list element and maintain the stylying of the original class, however, when I replace it overwrites the CSS. When I try add new styling to it it doesn't seem to work. I may be mis-understanding the html() function - can it have styling applied to it?

$('#listElement>li:eq(1)').html('replacement text').addClass('.progressStep')

$('.progressStep').css({
   'width': '140px',
   'display': 'block',
   'margin': '10px 0 0 -60px',
   'color': '#c5c5c5'
})

Upvotes: 0

Views: 46

Answers (2)

Milind Anantwar
Milind Anantwar

Reputation: 82241

You have passed .progressStep as argument to .addClass(). which is adding class .progressStep and not progressStep

You do not need to use class selector in .addClass() method. you should simply pass classname(s) as an argument. In current case, use addClass('progressStep') instead of addClass('.progressStep'):

$('#listElement>li:eq(1)').html('replacement text').addClass('progressStep')

Upvotes: 1

StudioTime
StudioTime

Reputation: 24019

Try this:

$('#listElement>li:eq(1)').text('replacement text').addClass('.progressStep')

You only need to use html if you're actually adding html

Upvotes: 0

Related Questions