How do I assign a variable to a css style in jquery

Question

0.00/5 (No votes)

See more:

I used the following code for changing the content of a style..

JavaScript

$("#Button1").click(function () {

          var str="12";
          if ($('#additionalStyles').length)
          {
              $('#additionalStyles').remove();
          }
          else
          {
              $('head').append('<style id="additionalStyles">.noti_bubble:before{color: yellow; content:'"+str+"''';}</style>');


          }

          });

The actual css code is ......

CSS

.noti_bubble:before{
    position:absolute;
    padding:1px 2px 1px 2px;
    background-color:red;
    content:"5";
    color:white;
    font-weight:bold;
    height : 11px;
    width: 15px;
}

The jquery changes the colour to yellow. but not change the content from 5 to 12....
pls help me....

Posted 28-Oct-14 20:51pm

Nijisha Kc

Updated 29-Oct-14 0:12am

Shemeemsha (ഷെമീംഷ)

v2

Add a Solution

2 solutions

Solution 1

Try this.
Note: haven't tested but hope this works :)

C#

$("#Button1").click(function () {

           var str="12";
           if ($('#additionalStyles').length)
           {
               $('#additionalStyles').remove();
           }
           else
           {
               $('head').append("<style id='additionalStyles'>.noti_bubble:before{color: yellow; content:'"+str+"''';}</style>");


           }

           });

Posted 29-Oct-14 0:22am

Suvendu Shekhar Giri

Add a Solution

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

Peter Leow · Accepted Answer · 2014-10-29T05:23:00

Solution 2

properly pairing of ' and ", try this:

$('head').append('<style id="additionalStyles">.noti_bubble:before{color: yellow; content:"'+str+'";}</style>');

Posted 29-Oct-14 5:23am

Peter Leow

Comments

Nijisha Kc 30-Oct-14 1:52am

i have tried this.but...

Peter Leow 30-Oct-14 3:34am

Seeing is believing:
http://jsfiddle.net/uqf02522/

Nijisha Kc 30-Oct-14 4:26am

ys. its worked. is this a temporary change?

How do I assign a variable to a css style in jquery

2 solutions

Solution 2

Solution 1

Add your solution here

Preview 0

How do I assign a variable to a css style in jquery

2 solutions

Solution 2

Solution 1

Add your solution here

Preview 0

Existing Members

...or Join us