.html() and .append() without jQuery

Question

Can anyone tell me how can I use these two functions without using jQuery?

I am using a pre coded application that I cannot use jQuery in, and I need to take HTML fr

Answer 1

• .html(new_html) can be replaced by .innerHTML=new_html
• .html() can be replaced by .innerHTML
• .append() method has 3 modes:
  • Appending a jQuery element, which is irrelevant here.
  • Appending/Moving a dom element.
    .append(elem) can be replaced by .appendChild(elem)
  • Appending an HTML code.
    .append(new_html) can be replaced by .innerHTML+=new_html

Examples

var new_html = 'Moshi';
var new_elem = document.createElement('div');
// .html(new_html)
new_elem.innerHTML = new_html;
// .append(html)
new_elem.innerHTML += ' ' + new_html;
// .append(element)
document.querySelector('body').appendChild(new_elem);

Notes

1. You cannot append tags using innerHTML. You'll have to use appendChild.

2. If your page is strict xhtml, appending a non strict xhtml will trigger a script error that will break the code. In that case you would want to wrap it with try.

3. jQuery offers several other, less straightforward shortcuts such as prependTo/appendTo after/before and more.

4. One cannot append