JSFiddle - React, Tailwind, and code Playground

HTML

<div>
    <p contenteditable='true'>ajdsflkjasdlfkjasdlfjdklasfD</p>
</div>
<div>
    <p contenteditable='true'>oqewrujfzkljvladswjoaiewnlei</p>
</div>
<div>
    <p contenteditable='true'>2345rtsdghwregg342534tres34</p>
</div>
<div>
    <p contenteditable='true'>a234trey36y34ttgfttqerertuityt</p>
</div>
<div>
    <p contenteditable='true'>1234rgdfs563ju6tref43f5eyrew65htew</p>
</div>

JavaScript

$(function() {
    $('[contenteditable="true"]').each(function() {
        var parent = $(this).parent(),
            text   = $(this).text(),
            select = function() {
                var returnstring = '';
                for (var i in text) {
                    returnstring += "<option value='" + text[i] + "'>" + text[i] + "</option>";
                }
                return "<select>" + returnstring + "</select>";
            }();
        $(this).empty();
        parent.append(select);
    });
});