Hey there! I've got a div with a dropdown menu that reveals text and images based on the selected option. What I want to achieve is having a button that allows users to copy all the content inside the div.
Below is my sample code for the div dropdown:
<div class="button dropdown">
<select id="colorselector">
<option>Select Email templates here</option>
<option value="1st">R17 Update</option>
<option value="2nd">Reset Password</option>
</select>
</div>
Upon selection from the dropdown, it displays relevant text and images within the div.
<!---------------------------- P ID 1st---------------------->
<div id="1st" class="colors yellow">
<br>
<p>Sample text</p>
<br>
<p>Sample text/p>
<br>
<p>Sample text</p>
<br>
<p>Sample Image</a></p>
<img src="https://i.screenshot.net/dl/8j82ein?name=4.jpg" alt="">
<br>
<br>
</div>
<!---------------------------- P ID 2nd---------------------->
<div id="2nd" class="colors red">
<br>
<p>Sample text</p>
<br>
<p>Sample text/p>
<br>
<p>Sample text</p>
<p>Sample Image</p>
<img src="https://i.screenshot.net/dl/8j82ein?name=4.jpg" alt="">
<br>
<font color="#08298A">Kind Regards,
<br>
</div>
Now, I'm looking to add a button that will help in copying the highlighted text/image within the specific P ID.
For instance:
A user selects the "R17 Update" option from the dropdown
The related content displayed would be:
Sample text
Sample text
Sample text
Sample Image (Image here)
When the user clicks the following button, it should highlight or select all content of the P I.D for copying.
Thank you in advance for any assistance!