Santhucool
Santhucool

Reputation: 1726

Making font strong to normal using jquery not working

I have a div like the following:

<div id="div1" ><strong>some text</strong></div>

I want to make the font normal using jquery. I tried as follows:

$("#div1").css("font-weight", "normal !important");

But it is not working!!

Upvotes: 0

Views: 570

Answers (2)

Amit
Amit

Reputation: 46361

What your code does is set the font weight for the content of the <div>, and using !important can help override other css settings to the same element.

There are 2 problems though:

One problem is that the content (text...) is inside a nested element, and that has it's own style. You can either set the style of the nested element, or remove it altogether.

The other is that !important doesn't work inside $().css(). So you should try to get rid of it if you can (to avoid complex solutions).

Assuming you need an element to wrap the text (for whatever reason), I'd suggest replacing it with a more appropriate descriptive element (or rather, less descriptive in this case) and play with the style as needed:

$("#myText").css("font-weight", "normal");
#myText {
  font-weight: bold
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="div1" ><span id="myText">some text</span></div>

Upvotes: 0

Paulie_D
Paulie_D

Reputation: 115363

You need to select the <strong> not the div.

$("#div1 strong").css("font-weight", "normal");
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="div1"><strong>some text</strong>
</div>

Upvotes: 4

Related Questions