prettifyにワンクリックコピーボタンを付けたい

前提・実現したいこと

「pre code」にprettifyを導入して、既存のコピーボタンも動くようにしたいです。
今のままだとソースコードの一番初めしかコピーできません。コード全体をコピーするためにはどうしたらよいか、煮詰まっているのでお助けください。

エラーメッセージ

特になし

該当のソースコード

javascript
1// code
2$(function(){
3    $("body").on("click",".code-copy",function(e){
4        var textElem = $(this).parents("pre code").find("li");
5        window.getSelection().selectAllChildren(textElem[0]);
6        document.execCommand("copy");
7        $(this).addClass("precopy-active");
8        $(this).delay(2000).queue(function() {
9            $(this).removeClass("precopy-active").dequeue();
10        });
11    });
12});

HTML
1<head>
2<link rel="stylesheet" href="https://cdn.linearicons.com/free/1.0.0/icon-font.min.css">
3</head>
4
5<pre><code class="prettyprint linenums lang-css" data-code="CSS" data-icon="&#xe86a;"><span class="lnr lnr-file-add"></span><div class="code-copy"><span class="precopy-text"> </span></div>/* ruby */
6[data-ruby] {
7    display: inline-block;
8    position: relative;
9}
10</code></pre>
11<!-- 省略　-->
12<script src="../assets/js/prettify.js"></script>
13<script>prettyPrint();</script>

CSS
1/* コード */
2code {
3    border: none;
4    font-family: 'Source Sans Pro','Noto Sans JP', sans-serif !important;
5    margin: 0 0.25rem;
6    padding: 0.25rem 0.65rem;
7    border: solid 1px #eeeeee;
8    color: var(--dark);
9}
10pre {
11    position: relative;
12    width :100% !important;
13    -webkit-overflow-scrolling: touch;
14    overflow-x: auto;
15    text-align: left;
16    margin: .9rem 0;
17}
18pre code {
19    width: 100% !important;
20    overflow-x: auto;
21    display: block;
22    position: relative;
23    padding: 3rem 1.5rem .5rem;
24    font-weight: 400;
25    box-sizing: border-box !important;
26}
27pre code em {
28    font-style: normal;
29    background-color: #424242;
30    display: inline-block;
31    width: 100%;
32}
33pre code::before,
34pre code::after,
35.code-copy,
36pre code .lnr {
37    display: block;
38    position: absolute;
39    padding: 0 1rem;
40    font-size: 1.02rem;
41    font-weight: 400;
42    font-family: "Roboto", sans-serif;
43    color: #fff;
44}
45pre code::before {
46    content: attr(data-code);
47    top: 0;
48    width: 100%;
49    margin:0 -1.5rem 0;
50    padding: 0 1rem 0 2.8rem;
51    background: rgba(157, 171, 192, .7);
52}
53pre code::after,
54pre code .lnr {
55    font-size: 1.1rem;
56}
57pre code::after {
58    content: attr(data-icon);
59    font-family: Linearicons-Free;
60    speak: none;
61    font-style: normal;
62    font-weight: 500;
63    font-variant: normal;
64    text-transform: none;
65    line-height: inherit;
66    -webkit-font-smoothing: antialiased;
67    -moz-osx-font-smoothing: grayscale;
68    top: 0;
69    left: 0;
70}
71pre code .lnr {
72    line-height: inherit !important;
73    top: 0;
74    right: calc(48px);
75    width: auto;
76    padding: 0 .5rem;
77    font-weight: 400;
78    font-family: 'Linearicons-Free';
79    z-index: 1;
80}
81.code-copy {
82    text-align: center;
83    top: 0;
84    right: 0;
85    margin: 0;
86    width: 80px;
87    cursor: pointer;
88    overflow: hidden;
89    -webkit-transition: all 0.2s;
90    -moz-transition: all 0.2s;
91    transition: all 0.2s;
92    background: rgba(184, 157, 191, .7);
93    z-index: 0;
94}
95.code-copy .precopy-text::before,
96.code-copy:before,
97.code-copy .precopy-text {
98    -webkit-transition: all 0.2s;
99    -moz-transition: all 0.2s;
100    transition: all 0.2s;
101}
102.code-copy .precopy-text::before,
103.code-copy:before {
104    position: absolute;
105}
106.code-copy .precopy-text::before {
107    right: -10%;
108    width: 100%;
109    content: 'copy';
110}
111.code-copy::before {
112    right: -100%;
113    width: 100%;
114    content: "copied";
115}
116.precopy-active{
117    background: #9c9c9c;
118}
119.precopy-active:before {
120    right: -10%;
121}
122.precopy-active .precopy-text::before {
123    -webkit-transform: translateX(300%);
124    -moz-transform: translateX(300%);
125    -ms-transform: translateX(300%);
126    transform: translateX(300%);
127    right: -100%;
128}
129
130/*-----------------------------------------------------------------------------
131prettify
132------------------------------------------------------------------------------*/
133
134/**
135* @license
136* Copyright (C) 2015 Google Inc.
137*
138* Licensed under the Apache License, Version 2.0 (the "License");
139* you may not use this file except in compliance with the License.
140* You may obtain a copy of the License at
141*
142*      http://www.apache.org/licenses/LICENSE-2.0
143*
144* Unless required by applicable law or agreed to in writing, software
145* distributed under the License is distributed on an "AS IS" BASIS,
146* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
147* See the License for the specific language governing permissions and
148* limitations under the License.
149*/
150
151/* Pretty printing styles. Used with prettify.js. */
152
153.prettyprint {
154    background: #fff;
155    border: 1px solid #eee !important;
156    padding-left: 3rem;
157    padding-right: 0;
158}
159
160.pln {
161    color: #333;
162}
163
164@media screen {
165    /* string content */
166    .str {
167        color: #d14;
168    }
169
170    /* keyword */
171    .kwd {
172        color: #333;
173    }
174
175    /* comment */
176    .com {
177        color: #998;
178    }
179
180    /* type name */
181    .typ {
182        color: #458;
183    }
184
185    /* literal value */
186    .lit {
187        color: #458;
188    }
189
190    /* punctuation */
191    .pun {
192        color: #333;
193    }
194
195    /* lisp open bracket */
196    .opn {
197        color: #333;
198    }
199
200    /* lisp close bracket */
201    .clo {
202        color: #333;
203    }
204
205    /* markup tag name */
206    .tag {
207        color: #000080;
208    }
209
210    /* markup attribute name */
211    .atn {
212        color: #008080;
213    }
214
215    /* markup attribute value */
216    .atv {
217        color: #d14;
218    }
219
220    /* declaration */
221    .dec {
222        color: #333;
223    }
224
225    /* variable name */
226    .var {
227        color: #008080;
228    }
229
230    /* function name */
231    .fun {
232        color: #900;
233    }
234}
235/* Specify class=linenums on a pre to get line numbering */
236ol.linenums {
237    margin-top: 0;
238    margin-bottom: 0;
239    margin-left: .7rem;
240    color: #cccccc;
241}
242li.L0,
243li.L1,
244li.L2,
245li.L3,
246li.L4,
247li.L5,
248li.L6,
249li.L7,
250li.L8,
251li.L9 {
252    padding-left: 1rem;
253    background-color: #fff;
254    list-style-type: decimal-leading-zero;
255    margin-right: -1rem;
256}
257li.L1,
258li.L3,
259li.L5,
260li.L7,
261li.L9 { background: #f7f7f7 }
262
263/*-----------------------------------------------------------------------------
264
265------------------------------------------------------------------------------*/