Select range in contenteditable div

I've got a contenteditable div and a few paragraphs in it.

Here's my code:

<!DOCTYPE HTML>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    </head>
    <body>
        <div id="main" contenteditable="true" 
             style="border:solid 1px black; width:300px; height:300px">
            <div>Hello world!</div>
            <div>
                <br>
            </div>
            <div>This is a paragraph</div>
        </div>
    </body>
</html>

Assuming, I want to make a range selection which will contain the string "world! This is"

How to do that?

Select range in contenteditable div

1 Answers