CODEWITHSUNDEEP
javascriptjquerycssfont-sizecontains
fob
fob

Reputation: 43

jquery find text and change size

I have a грн text in a div "price" with a span class "price-red"

    <div class="price">

<table width="100%" border="0" cellpadding="0" cellspacing="0">
<tr>
    <td width="190"><span class="price-text">Цена для вас:</span></td>
    <td></td>
    <td></td>
</tr>
<tr><td colspan="3" height="10"></td></tr>
<tr>
    <td><nobr><span class="price-red"><b>299 грн.</b></span></nobr></td>
    <td></td>
    <td></td>
</tr>
</table>
</div>

css 

.price-red{
font-family: Arial, Helvetica, sans-serif;
font-size: 60px;
text-transform: none;

}

I need to find it with jquery and change font from 60px to 40px only for "грн" So I tried this:

<script>
$(document).ready(function(){
  $('span.price-red:contains("грн")').css('font-size', '40px');
});
</script>

Text 299 грн. is generated by php like this: 

<td><?php if (!empty($special)){ ?><span class="price-red">Sale!</span><?php }else{ ?><nobr><span class="price-red"><b><?php echo $price; ?></b></span></nobr><?php } ?></td>
    <td><?php if (!empty($special)){ ?><span class="price-red"><b><?php echo $special; ?></b></span><?php } ?></td>
    <td></td>
</tr>

Answer 

   $(document).ready(function(){
$('span.price-red:contains("грн")').html(function () {
    return this.innerHTML.replace("грн", "<span style='font-size:40px'>грн</span>")
});
});

Upvotes: 0

Views: 1196

Answers (3)

Anton
Anton

Reputation: 32581

If you only want to change rph you can do this with html() and wrap rph with a span

$('span.price-red:contains("грн")').html(function () {
    return this.innerHTML.replace("грн", "<span style='background:blue;font-size:40px;'>грн</span>")
});

DEMO

Upvotes: 2

matewka
matewka

Reputation: 10158

Your code looks fine. The problem might be character encoding. If your jQuery code and HTML are placed in different files they might have different encoding.
To test it, try replace the span content with some standard letters, like "rph" and see if :contains selector works with them.

Upvotes: 1

Rituraj ratan
Rituraj ratan

Reputation: 10388

$(document).ready(function(){
  $('.price span.price-red:contains("грн")').css('font-size', '40px');
});

reference contains-selector

Upvotes: 0

Related Questions