jQuery adding multiple non-html rows

0

I'm using the following code:

 $("#divPrincipal").prepend('<p class="text-success">Você terá aproximadamente ' +     resultado + ' plantas </p>');

The idea was to click on a button and it will print the line with the result in my HTML form, however if the user clicks on the button it will be replicating this line. Is there any way to overwrite the line, or write the line one instead, or print the result in another way?

    
asked by anonymous 23.11.2014 / 01:52

2 answers

2

Instead of supplementing the content of the div with prepend (or append ), set the whole content with .html() :

$("#divPrincipal").html('<p class="text-success">Você terá aproximadamente ' + resultado + ' plantas </p>');

This clears the div and fills again with the last content.

    
23.11.2014 / 02:17
2

Just to complement @bfavaretto's response, if in some situation you have to put a result in a pre-determined place, you can use .text to change only the content of an element:

var resultado = 17;
$("#resultado").text( 'Você terá aproximadamente ' + resultado + ' plantas');
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><pclass="text-success" id="resultado"></p>

In this example, <p> already exists in HTML, and you are only changing content.

Note: Unlike .html , if you use .text( 'um <em>dois</em> tres' ) , <em> will appear literally, instead of emphasizing dois .

    
25.11.2014 / 05:49