JS:複数個の場合、選択されたものだけに判定をつけたい

html
1<article class="flip js-flip">
2　　<a href="#">
3　　　　　<div class="flip__inner js-flip-inner">
4	<div class="front">
5		<div class="member">
6			<img src="#" alt="">
7		</div>
8		<h2><span>##</span><span>##</span></h2>
9	</div>
10	<div class="back">
11		<div class="member">
12			<img src="#" alt="">
13		</div>
14                <h2><span>##</span><span>##</span></h2>
15	</div>
16</a>
17</article>
18<article class="flip js-flip">
19　　<a href="#">
20　　　　　<div class="flip__inner js-flip-inner">
21	<div class="front">
22		<div class="member">
23			<img src="#" alt="">
24		</div>
25		<h2><span>##</span><span>##</span></h2>
26	</div>
27	<div class="back">
28		<div class="member">
29			<img src="#" alt="">
30		</div>
31                <h2><span>##</span><span>##</span></h2>
32	</div>
33</a>
34</article>

↑上記のような「flip」が複数(3個以上想定)ある場合に、画像を切り替えたい対象のものだけを回転させたい！
（コインのように回転して裏の画像に切り替わるという想定）

js
1// UA判定のJSライブラリーを実行
2const uAParser = UAParser();
3
4const $flip = $('.js-flip');
5const $flipInner = $('.js-flip-inner');
6
7// コインフリップ関数
8const coinflip = () => {
9
10  // イージング関数
11  let easing = (count, b, c, d, s) => {
12    if (s === undefined) s = 1.70158;
13    return c * ((count = count / d - 1) * count * ((s + 1) * count + s) + 1) + b;
14  };
15
16  // 回転中の状態から元に戻す
17  let reset = () => {
18    $flipInner.css('transform', '');
19  };
20
21  let frame = 20;
22  let count = 0;
23  let rotation = {
24    x: 0,
25    y: 0
26  };
27  // さわり始めた時のx座標とy座標を保存
28  let point = {
29    x: 0,
30    y: 0,
31    dx: 0,
32    dy: 0
33  };
34  let tmp = {
35    x: 0,
36    y: 0
37  };
38  let moving = false;
39  let animating = false;
40
41  let touchStartHandler = (e) => {
42    if (uAParser.device.type !== 'mobile') return;
43    if (moving) return;
44    let touch = e.originalEvent.touches[0];
45    point.x = touch.screenX;
46    point.y = touch.screenY;
47    point.dx = 0;
48    point.dy = 0;
49  };
50
51  let touchMoveHandler = (e) => {
52    if (uAParser.device.type !== 'mobile') return;
53    if (animating) return;
54    moving = true;
55    let touch = e.originalEvent.touches[0];
56    let x = (touch.screenX - point.x);
57    let y = (touch.screenY - point.y);
58    point.dx += x;
59    point.dy += y;
60
61    if (Math.abs(point.dx) > 10) {
62      e.preventDefault();
63    }
64
65    point.x = touch.screenX;
66    point.y = touch.screenY;
67
68    if (point.dx > 180) {
69      point.dx = 180;
70    } else if (point.dx < -180) {
71      point.dx = -180;
72    }
73
74    roll(point.dx);
75  };
76
77  let touchEndHandler = () => {
78    if (uAParser.device.type !== 'mobile') return;
79    if (!moving || animating) {
80      return;
81    }
82    moving = false;
83    point.x = point.y = 0;
84    tmp.x = rotation.x + point.dx;
85    tmp.y = rotation.y + point.dy;
86    if (point.dx > 45) {
87      tmp.lx = rotation.x + 180;
88    } else if (point.dx < -45) {
89      tmp.lx = rotation.x - 180;
90    } else {
91      tmp.lx = rotation.x;
92    }
93    animating = true;
94    tmp.ly = 0;
95    count = 0;
96    setTimeout(loopHandler, 16);
97  };
98
99  let loopHandler = () => {
100    let rx = easing(count, tmp.x, tmp.lx - tmp.x, frame - 1) - rotation.x;
101    let ry = easing(count, tmp.y, tmp.ly - tmp.y, frame - 1) - rotation.y;
102    if (count === frame) {
103      rotation.x += rx;
104      rotation.y += ry;
105      animating = moving = false;
106      return;
107    }
108    count++;
109    roll(rx);
110    setTimeout(loopHandler, 16);
111  };
112
113  // 計算した値を指定
114  let roll = (x) => {
115    $flipInner.css('transform', 'rotateY(' + (x + rotation.x) + 'deg)');
116  };
117
118  // Event
119  $flip.on('touchstart', touchStartHandler);
120  $flip.on('touchmove', touchMoveHandler);
121  $flip.on('touchend', touchEndHandler);
122
123  // リセット用イベント
124  $(window).on('resize', reset);
125};
126
127coinflip();