クリックされた要素の隣接要素の子要素を取得したいです

Question

以下のHTMLより

<div class="img-wrapper">
	<img src="/hoge_img.jpeg" alt="" class="img_class">
	<div class="caption">
		<div class="name">
			<span>hoge_name</span>
		</div>
		<div class="name_b">
			<span>name_b</span>
		</div>
	</div>
</div>

.img_class をクリックした際、隣接している.caption配下の
以下セレクターのspan値を取得しreturnを返したいです。
.name > span
.name_b > span

js、jQueryいずれでも大丈夫ですので、
値を取得するためのscriptをご教授いただければ幸いです。

どうぞよろしくお願いいたします。

Answer 1

[...document.querySelector(".img_class").nextElementSibling.querySelectorAll(".name > span, .name_b > span")].map(el=>el.innerText)

Comments

[zagin]

ありがとうございます。