updated js to copy clicked link text. Also don't need id tags any more.

app/views/vehicles/_details.html.erb

@@ -18,7 +18,7 @@
           
           <tr>
             <th><%= t(:field_vin) %></th>
-            <td id="vin">
+            <td>
                <a href="#" onclick="handleCopy(event)"><%= @vin[0] if @vin %><b><%=@vin[1] if @vin%></b></a>
             </td>
           </tr>

app/views/vehicles/_list.html.erb

@@ -12,7 +12,7 @@
         </div>
 
         <div class="label-sub">
-          <%= vehicle.vin.scan(/.{1,9}/)[0] if vehicle.vin %><b><%=vehicle.vin.scan(/.{1,9}/)[1] if vehicle.vin%></b>
+          <a href="#" onclick="handleCopy(event)"><%= vehicle.vin.scan(/.{1,9}/)[0] if vehicle.vin %><b><%=vehicle.vin.scan(/.{1,9}/)[1] if vehicle.vin%></b></a>
         </div>
       
       </div>

assets/javascripts/copy.js

@@ -1,17 +1,25 @@
 async function handleCopy(event) {
   console.log("Copy link clicked");
+
   // 1. Prevent the link from actually navigating
   event.preventDefault();
-
-  // 2. Grab the text from our span
-  const text = document.getElementById('vin').innerText;
+  
+  let text;
+  let link;
+  // 2. Grab the text from our clicked link
+  if(event.target.tagName.toLowerCase() === 'b'){
+    text = event.target.parentElement.innerText;
+    link = event.target.parentElement;
+  } else {
+    text = event.target.innerText;
+    link = event.target;
+  }
 
   try {
     // 3. Write to clipboard
     await navigator.clipboard.writeText(text);
     
     // 4. Update the UI to show it worked
-    const link = event.target;
     const originalText = link.innerText;
     link.innerHTML = "<b>Copied!</b>";
     link.style.color = "#4CAF50"; // Turn green