JS - How to add a style inside a new class?

2

Is it possible with javascript to add an element to a class?

EX: Have a class:

.post_22 {color:red}

Until then it only has color, but when you click on a link:

<a onclick="minBox()">Seu Poste</a>

Would you like to add CLASS post_22 to another style?

I know you can use it with css() , but on the screen there is setInterval , which means that when it refreshes again it would remove the css() that would be assigned to the class through css (), in which case direct attribution in the class would not be removed in the next setInterval .

Remembering that the class post_22 el does not really exist in the css file, it can be post_1 , post_2 , post_3 .... this comes according to ID on the server linked to post.

If on the server the ID of the post: "Hello my friend." for "ID: 66" it generates class post_ and joins with ID post_66

    
asked by anonymous 28.07.2015 / 16:49

3 answers

3

Good afternoon there is no way you can change the style of a class what you can do is use

$("#ElelementoId").css({"body":"Value","outro":"valor"});

or if you want to write a class in html you can do the following

$("head").append("<style>.minhaclasse{aqui o  meu estilo}</style>");
    
28.07.2015 / 17:04
3

Yes, using css as you mentioned earlier:

$('.classe').css('propriedade', 'valor')

Example:

function RefreshClass(){
    $('.classe').css('text-decoration', 'underline');
}

RefreshClass();

function minBox(){
  $('div').append(
    $('<p />').addClass('classe').text('Lorem ipsum dolor sit amet, consectetur adipisicing elit. Animi voluptates veritatis inventore voluptatum magnam sed voluptas perferendis porro doloremque quidem natus iste ipsa. Dolore nostrum illo odit dolor incidunt fuga.')
  );

  // Atualiza a Classe novamente.
  RefreshClass();
}
.classe{
    font-family:Arial, Verdana, sans-serif;
    font-size:12px;
    color:#333;
    text-decoration:none;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><buttononclick="minBox()">Postar</button>

<div></div>

Note: All code here can be played without jQuery.

    
28.07.2015 / 17:01
0

In your css, use something like:

a[class*='post'] {
    color: red;
    font-size: 20px;
}

This rule in your css will apply what you want to all elements to with a class that the name contains "post".

Example in JSFiddle.

    
28.07.2015 / 17:07