How to add a javascript variable to div?

Question

I have some code that is roughly along the lines of this:

exportValue = []; 

function reduceArray() {
    //does something 
    exportValue = parseFloat(exportValue)
}

From that, I get that exportValue is 73951. I then have to add that number to the page... so I tried both of these:

$("#exportValueDiv").append(exportValue);
$("#exportValueDiv").append("<li>" + exportValue + "</li>");

But that doesn't work.. I'm confused on how to add something like a variable to the DOM....

If I do something like:

$( "#exportValueDiv" ).append( "<li>value</li>")

it works, but I don't want to add a string, I want to add the value of the variable. I looked this up, but I'm still confused, so any help would be greatly appreciated!!!

jQuery's append() method (as you're using it) appends an HTML element (identified by a string containing HTML, a wrapped jQuery element or an actual element object), not "text". If you want to simply set the content of your div to the value try $("#exportValueDiv").text(exportValue); — oroboto
– oroboto, Commented Feb 18, 2016 at 0:31

Vinny M · Accepted Answer · 2016-02-18 00:34:04Z

4

Look into jQuery manipulation

$("#exportValueDiv").text(exportValue); //Replaces text of #exportValueDiv
$("#exportValueDiv").html('<span>'+exportValue+'</span>'); //Replaces inner html of #exportValueDiv
$("#exportValueDiv").append('<span>'+exportValue+'</span>'); //Adds to the inner html of #exportValueDiv

answered Feb 18, 2016 at 0:34

Vinny M

7704 silver badges14 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

ocean800 Over a year ago

Thanks for the explanation! But I figured out my error was due to an unfinished AJAX call

hagmic · Accepted Answer · 2016-02-18 00:33:33Z

2

The .append() contract expects a DOM element or HTML String. You will need to do:

$("#exportValueDiv").append("<div>" + exportValue + "</div>");

answered Feb 18, 2016 at 0:33

hagmic

1469 bronze badges

2 Comments

SergeantHacker Over a year ago

He spent the time to link to documentation.

ocean800 Over a year ago

Thanks for the answer!

Jonathan Zúñiga · Accepted Answer · 2016-02-18 00:29:42Z

1

Try this:

$("#exportValueDiv").append("<div>" + exportValue + "</div>");

answered Feb 18, 2016 at 0:29

Jonathan Zúñiga

6453 gold badges13 silver badges25 bronze badges

1 Comment

ocean800 Over a year ago

Thanks for the answer!

Dave · Accepted Answer · 2016-02-18 00:35:38Z

1

The following appends your variable to a div that already has information:

<div id="exportValueDiv">
<p>
Some information.
</p>
</div>

<script>
var exportValue = "Hello world.";
$("#exportValueDiv").append('<p>'+ exportValue +'</p>');
</script>

https://jsfiddle.net/supadave57/f9tqw0d4/

answered Feb 18, 2016 at 0:35

Dave

725 bronze badges

1 Comment

ocean800 Over a year ago

Thanks for the answer!!

Collectives™ on Stack Overflow

How to add a javascript variable to div?

4 Answers 4

1 Comment

2 Comments

1 Comment

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

1 Comment

2 Comments

1 Comment

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related