RichTextEditor Demo
Home Pricing

### insertHTML()

This example shows how to use editor.InsertHTML(html) method to insert the specified HTML into editor. If anything is selected, the selection is replaced with the new HTML and text.

### Demo Code:

    import { TypeScriptRichTextEditor } from "ts-rich-text-editor";

    const editor = await TypeScriptRichTextEditor.create("#div_editor1", {}, {
      basePath: "/richtexteditor",
    });

    editor.html = "<p>Hello World</p>";

    // Insert HTML at current position
    editor.instance.insertHTML("Time is " + new Date().toLocaleTimeString());
    editor.instance.collapse(false);
    editor.focus();

    // Insert HTML at document end
    editor.instance.selectDoc(false);
    editor.instance.insertHTML("<p>Insert a new paragraph</p>");
    editor.instance.collapse(false);
    editor.focus();

    <link rel="stylesheet" href="/richtexteditor/rte_theme_default.css" />
    <script type="text/javascript" src="/richtexteditor/rte.js"></script>
    <script type="text/javascript" src='/richtexteditor/plugins/all_plugins.js'></script>
    <div id="div_editor1"></div>

    <script>
    	var editor1 = new RichTextEditor("#div_editor1");

    	editor1.setHTMLCode("<p>Hello World</p>");

    	function btnInsertHTMLCode_1() {
    		editor1.insertHTML("Time is" + new Date().toLocaleTimeString())
    		editor1.collapse(false);
    		editor1.focus();
    	}
    	function btnInsertHTMLCode_2() {
    		editor1.selectDoc(false);//collapse to document end
    		editor1.insertHTML("<p>Insert a new paragraph " + new Date().toLocaleTimeString() + "</p>")
    		editor1.collapse(false);
    		editor1.focus();
    	}
    </script>

    <div class="mt-4">
    	<button class="btn btn-sm btn-outline-primary btn-pill transition-3d-hover px-5" onclick="btnInsertHTMLCode_1();return false;">insertHTML at a specified position</button>
    	<button class="btn btn-sm btn-primary btn-pill transition-3d-hover px-5" onclick="btnInsertHTMLCode_2();return false;">insertHTML at the end of this document</button>
    </div>

### Relative Links

- Use JavaScript API