2
<table>
    <tr>
        <td class="valor"> 33</td>
        <td class="valor"> 88</td>
        <td class="valor"> 55</td>
        <td class="valor"> 36</td>
        <td class="valor"> 79</td>
        <td class="valor"> 35</td>
    </tr>
</table>

Preciso colocar o simbolo de porcentagem após o número

<script type="text/javascript">
    $(document).ready(function(){
       var valor = $('.valor').html();
       $('.valor').text(valor+'%');
    });                   
</script>

Tentei fazer desta forma mas ele altera todos os numeros para o primeiro valor

1
  • Você já recebeu 5 respostas. Por favor, considere escolher como certa uma delas, para ajudar outras pessoas que também tenham a mesma dúvida. Abraços. 30/06/2021 às 15:21

5 Respostas 5

6

Tem que fazer o concat para cada um, a sugestão aqui é fazer com o each:

  $(document).ready(function(){
       var valor = $('.valor').each(function(){
       		val = $(this).html()
          $(this).html(val + '%')
       })   
    });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
<tr>
<td class="valor"> 33</td>
<td class="valor"> 88</td>
<td class="valor"> 55</td>
<td class="valor"> 36</td>
<td class="valor"> 79</td>
<td class="valor"> 35</td>
</tr>
</table>

4

Algumas formas de fazer:

1 - Usando JQuery (exemplo funcionando)

$('.valor').append('%');

2 - Usando apenas CSS (exemplo funcionando)

.valor:after {
  content: "%";
}

Esta técnica utiliza o pseudo-elemento ::after do CSS2. Confira a compatibilidade com os diferentes navegadores.

3 - Usando apenas Javascript (exemplo funcionando)

var valores = document.getElementsByClassName('valor');

for (var i=0; valores[i]; i++) {
  valores[i].innerHTML += '%';
}

Esta opção não precisa do JQuery, e é compatível também com alguns navegadores antigos.

1

Tens que fazer esse processo para cada elemento (obj) que tem atribuída a classe referida. Podes aceder aos dados do objecto com o wrapper JQuery $(this).

<script type="text/javascript">
    $(document).ready(function(){
       $('.valor').each(function(obj) {
          var valor = $(this).html();
          $(this).text(valor+'%');
       }); 
    });
</script>

Não testei mas acredito que será algo nestas linhas.

0
<script type="text/javascript">
$(document).ready(function(){
   var valores = $('.valor');
    for (i = 0; i < valores.length; i++) { 
        var valor = valores[i];
        valor.textContent = valor.textContent + '%';
    }
});
</script>
0

Você deve iterar sobre todos os itens. Pode fazer isso utilizando a função each. Você também pode acessar o elemento diretamente, como no código abaixo, ao invés de usar a função html().

$('.valor').each(function(){
    this.innerHTML+='%';
});

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .