JSFiddle - React, Tailwind, and code Playground
HTML
<div id="selectme"><p>Some text goes here!</p><input type="text" value="Hello"><p>Moar text!</p></div>
<p>Click me!</p>
CSS
Some text goes here!
Hello there!
Moar text!
JavaScript
jQuery.fn.selectText = function(){
this.find('input').each(function() {
if($(this).prev().length == 0 || !$(this).prev().hasClass('p_copy')) {
$('<p class="p_copy" style="position: absolute; z-index: -1;"></p>').insertBefore($(this));
}
$(this).prev().html($(this).val());
});
var doc = document;
var element = this[0];
console.log(this, element);
if (doc.body.createTextRange) {
var range = document.body.createTextRange();
range.moveToElementText(element);
range.select();
} else if (window.getSelection) {
var selection = window.getSelection();
var range = document.createRange();
range.selectNodeContents(element);
selection.removeAllRanges();
selection.addRange(range);
}
};
$(function() {
$('p').click(function() {
$('#selectme').selectText();
});
});