Javascript set text of div

you can use following helper function:

function content(divSelector, value) {
    document.querySelector(divSelector).innerHTML = value;
}

content('#content',"whatever");

Where #content must be valid CSS selector

Here is working example.


Additionaly - today (2018.07.01) I made speed comparison for jquery and pure js solutions ( MacOs High Sierra 10.13.3 on Chrome 67.0.3396.99 (64-bit), Safari 11.0.3 (13604.5.6), Firefox 59.0.2 (64-bit) ):

document.getElementById("content").innerHTML = "whatever"; // pure JS
$('#content').html('whatever');                            // jQuery

Javascript set text of div

The jquery solution was slower than pure js solution: 69% on firefox, 61% on safari, 56% on chrome. The fastest browser for pure js was firefox with 560M operations per second, the second was safari 426M, and slowest was chrome 122M.

So the winners are pure js and firefox (3x faster than chrome!)

You can test it in your machine: https://jsperf.com/js-jquery-html-content-change


The HTML DOM allows JavaScript to change the content of HTML elements.


Changing HTML Content

The easiest way to modify the content of an HTML element is by using the innerHTML property.

To change the content of an HTML element, use this syntax:

document.getElementById(id).innerHTML = new HTML

This example changes the content of a

element:

Example


Hello World!


Try it Yourself »

Example explained:

  • The HTML document above contains a

    element with id="p1"

  • We use the HTML DOM to get the element with id="p1"
  • A JavaScript changes the content (innerHTML) of that element to "New text!"

This example changes the content of an

element:

Example



Old Heading


Try it Yourself »

Example explained:

  • The HTML document above contains an

    element with id="id01"

  • We use the HTML DOM to get the element with id="id01"
  • A JavaScript changes the content (innerHTML) of that element to "New Heading"


Changing the Value of an Attribute

To change the value of an HTML attribute, use this syntax:

document.getElementById(id).attribute = new value

This example changes the value of the src attribute of an

Javascript set text of div


Try it Yourself »

Example explained:

  • The HTML document above contains an
    Javascript set text of div

    Start the Exercise



    How do I put text in a div?

    Use the insertAdjacentText() method to append text to a div element, e.g. container. insertAdjacentText('beforeend', 'your text here') . The method inserts a new text node at the provided position, relative to the element it was called on.

    Can we set value in div?

    div elements don't have a . value property that would get submitted to the backend; use an input element for that.

    How do you append text in JavaScript?

    To append text to an element:.
    Use the document. createTextNode() method to create a text node..
    Use the appendChild() method to append the text node to the element..
    The appendChild method will add the text node to the end of the element's list of children..

    How do you edit content in HTML?

    The easiest way to modify the content of an HTML element is by using the innerHTML property..
    The HTML document above contains a

    element with id="p1".

    We use the HTML DOM to get the element with id="p1".
    A JavaScript changes the content ( innerHTML ) of that element to "New text!".