Reputation: 2303
I have some HTML that is structured like this:
<div class="ProductPriceRating">
<em>
<strike class="RetailPriceValue">$65.00</strike>
$45.00
</em>
</div>
I need to select the "$45.00". I thought this would work:
$('.ProductPriceRating strike').siblings().css('background','red');
But it didn't
Upvotes: 0
Views: 53
Reputation: 10668
You can't style text nodes directly, instead wrap it in a span and style that:
HTML
<div class="ProductPriceRating">
<em>
<strike class="RetailPriceValue">$65.00</strike>
<span>$45.00</span>
</em>
</div>
jQuery
$('.ProductPriceRating strike').siblings().css('background','red');
If you can't change the HTML structure, you can try styling the em
and the strike
:
$('.ProductPriceRating em').css('background','red');
$('.ProductPriceRating strike').css('background','white');
Upvotes: 2
Reputation: 388416
You cannot apply a style to a text node, you need to wrap it with an element
Try
var node = $('.ProductPriceRating strike').get(0).nextSibling;
$(node).wrap('<span/>').parent().css('background','red');
Demo: Fiddle
Upvotes: 5