You need to put the cursor at the end of contenteditable using js and jq.

    1 answer 1

     const div = document.querySelector('div'); document.querySelector('button').addEventListener('click', () => { const range = document.createRange(); range.selectNodeContents(div); range.collapse(false); const sel = window.getSelection(); sel.removeAllRanges(); sel.addRange(range); }); 
     <div contenteditable="true">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Repudiandae quo ratione assumenda quam deserunt, a corporis vero ipsum vitae, id libero veniam error ipsa. Magnam molestiae sapiente delectus modi odio.</div> <button>Click me!</button>

    UPD. Using jQuery

      const div = $('div').get(0); // или $('div')[0]; $('button').on('click', () => { const range = document.createRange(); range.selectNodeContents(div); range.collapse(false); const sel = window.getSelection(); sel.removeAllRanges(); sel.addRange(range); }); 
     <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div contenteditable="true">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Repudiandae quo ratione assumenda quam deserunt, a corporis vero ipsum vitae, id libero veniam error ipsa. Magnam molestiae sapiente delectus modi odio.</div> <button>Click me!</button>

    • Can it be on JQ? I have the right div looking for JQ selectors and when loading them into the variable div nothing works - user272575
    • @brachkoff, added in response - Deonis