Copy from a html element

README.md

@@ -33,6 +33,12 @@ To copy text to clipboard  **data-copy-text="text"**  attribute to the button.
 <button class="btn btn-success" data-copy-text="Some text">Copy</button>
 ```
 
+### Copy Text - From Others Element
+To copy text to clipboard **data-copy-text="text"** attribute to the button.
+```html
+<button class="btn btn-success" data-copy-origin="#element">Copy</button>
+```
+
 ### Paste Text
 To paste data to a input element just add  **data-paste-target="#element"**  attribute to the button.
 ```html

index.html

@@ -55,21 +55,31 @@ <h5 class="text-success">Copy Text - From Input Element</h5>
 		</div>
 
 		<br>
-
 		<h5 class="text-success">Copy Text - From TextArea Element</h5>
 
 		<textarea id="txtArea" rows="3" class="form-control">Yes we can make difference.</textarea>
 		<br>
 		<button class="btn btn-success" data-copy-origin="#txtArea">Copy</button>
 
-		<br><br>
+		<br><br><br>
 
 		<h5 class="text-success">Copy Text - From Nowhere</h5>
 		<p>To copy text to clipboard <b>data-copy-text="text"</b> attribute to the button.</p>
 
 		<pre class="alert alert-secondary">&lt;button class="btn btn-success" data-copy-text="Some text"&gt;Copy&lt;/button&gt;</pre>
 
 		<button class="btn btn-success" data-copy-text="Just a text to be copied">Copy</button>
+
+		<br><br><br>
+		<h5 class="text-success">Copy Text - From Others Element</h5>
+
+		<p>To copy text to clipboard from a html element just include <b>data-copy-origin="#element"</b> attribute to the button.</p>
+
+		<pre class="alert alert-secondary">&lt;button class="btn btn-success" data-copy-origin="#element"&gt;Copy&lt;/button&gt;</pre>
+
+		<p id="txtTitle">Text copied from a <b>p</b> element.</p>
+		<button class="btn btn-success" data-copy-origin="#txtTitle">Copy</button>
+
 		<br><br><br>
 
 

src/CopyPasteJS.js

@@ -13,9 +13,18 @@ for(var i = 0; i < CopyPasteJS.copys.length; i++)
 		var copyOrigin = this.getAttribute("data-copy-origin");
 		var copyElement= document.querySelector(copyOrigin);
 
-		CopyPasteJS.data = copyElement.value;
 
-		copyElement.select();
+		if(copyElement.tagName && (copyElement.tagName.toLowerCase() == "input" || copyElement.tagName.toLowerCase() == "textarea"))
+		{
+			CopyPasteJS.data = copyElement.value;
+			copyElement.select();
+		}
+		else
+		{
+			CopyPasteJS.data = copyElement.innerText;
+			CopyPasteJS.selectText(copyOrigin);
+		}		
+
 		document.execCommand("copy");
 
 		var copyCallback = this.getAttribute("data-copy-callback");
@@ -115,8 +124,18 @@ CopyPasteJS.copyText = function(txt, callback)
 CopyPasteJS.copyFrom = function(elem, callback)
 {
 	var element = document.querySelector(elem);
-	element.select();
-	CopyPasteJS.data = element.value;
+
+	if(element.tagName && (element.tagName.toLowerCase() == "input" || element.tagName.toLowerCase() == "textarea"))
+	{
+		element.select();
+		CopyPasteJS.data = element.value;
+	}
+	else
+	{
+		CopyPasteJS.data = element.innerText;
+		CopyPasteJS.selectText(elem);
+	}
+
 	document.execCommand('copy');
 
 	if(callback)
@@ -150,6 +169,31 @@ CopyPasteJS.pasteTo = function(elem, callback)
 	}
 }
 
+// SELECT TEXT
+
+CopyPasteJS.selectText = function(element)
+{
+	var text = document.querySelector(element),
+		range, selection;
+
+	if (document.body.createTextRange)
+	{
+		range = document.body.createTextRange();
+		range.moveToElementText(text);
+		range.select()
+	}
+
+	else if (window.getSelection)
+	{
+		selection = window.getSelection();
+		range = document.createRange();
+		range.selectNodeContents(text);
+		selection.removeAllRanges();
+		selection.addRange(range)
+	}
+
+}
+
 window.addEventListener('load', function() {
     CopyPasteJS.init();
 });