CODEWITHSUNDEEP
jquery
Reft
Reft

Reputation: 2433

Append to li with a different color

I want to append to a list and i want that to be a different color. So first li should be black and the second one should be in a different color..

What I've tried:

$('ul', '.validation-summary-errors[data-valmsg-summary="true"]').html('<li>' + resp.failedMessage + '</li>');
$('ul', '.validation-summary-errors[data-valmsg-summary="true"]').append('<li>' + resp.successMessage + '</li>').css('color', '#438D80');

The color gets added to the ul instead of the li, (both li's gets a new color). How can this be solved?

Upvotes: 0

Views: 130

Answers (2)

alessandrio
alessandrio

Reputation: 4370

    $('ul', '.validation-summary-errors[data-valmsg-summary="true"]')
    .html('<li>' + resp.failedMessage + '</li>');

    var liTwo = $( '<li>' ).text( resp.successMessage ).css( 'color', '#438D80' );

    $('ul', '.validation-summary-errors[data-valmsg-summary="true"]')
    .append( liTwo );

Upvotes: 1

Arun P Johny
Arun P Johny

Reputation: 388326

You are setting the color to the ul not to the li

$('ul', '.validation-summary-errors[data-valmsg-summary="true"]').html('<li>' + resp.failedMessage + '</li>');

$('<li>' + resp.successMessage + '</li>').appendTo('.validation-summary-errors[data-valmsg-summary="true"] ul').css('color', '#438D80');

.append() returns the element to which the new element is appended, not the newly created element. You can use .appendTo() as given above

Upvotes: 0

Related Questions