I have a <div> element. In this <div> there is a <table> and <span> elements. And the <span> does not have a html id attribute.

I want to change font-size in the <span>. Can I do it with javascript or jQuery?

I try change class and directly give property with CSS, but they are not working.

How can I change font size?

my <div class="xxx">

and in the style

 .xxx  {
background-image:url('../k_g.png');
cursor: pointer;
background-repeat: no-repeat;
background-position: center 0%;
font-size:40px;
}

I have a <div> element. In this <div> there is a <table> and <span> elements. And the <span> does not have a html id attribute.

I want to change font-size in the <span>. Can I do it with javascript or jQuery?

I try change class and directly give property with CSS, but they are not working.

How can I change font size?

my <div class="xxx">

and in the style

 .xxx  {
background-image:url('../k_g.png');
cursor: pointer;
background-repeat: no-repeat;
background-position: center 0%;
font-size:40px;
}

• javascript
• jquery

• 1 Please add some code here of what you tried. – Harry Bomrah Commented Feb 24, 2014 at 10:25
• I edit my question. I want to change my div class when I change it I want to change font size. but it does not work – user3086226 Commented Feb 24, 2014 at 10:27
• Setup fiddle, there is not enough data for proper answer. – sinisake Commented Feb 24, 2014 at 10:28

5 Answers 5

If you span is not a direct child of the div with the class you could do

 .xxx span {
     font-size: 40px;
 }

However this will affect all spans inside the div and can have unforeseen consequences in the future.

You can apply the below CSS,

.xxx > span  {
    font-size:40px;
}

try

$(document).ready(function () {
        $(".xxx").css("font-size", "200%");
    });

Use:

$("div.xxx").children("span").css( "font-size", "30px" );

The first I wonder if this div with .xxx class was create before you call your script or not? If it's ok so just run this script in document.ready function in jQuery:

$(".xxx").css({font-size:"30px"});
or jQuery.noConflict();jQuery(".xxx").css({font-size:"30px"}); 

instead of you run some libraries using the same $ for that script.