クリック要素に対して特定クラスが付与されている親要素のIDの値を取得したい

Question

Javascript初心者です。Google Tag ManagerのカスタムJavascript設定で使用します。
クリックした要素に対して、特定のクラス名を持った親要素のIDの値を取得したいです。

まず、クリックした要素に対して、特定のクラス名を持った親要素の中にある『h2』の値を取得した成功例を記載します。
{{Click Element}}はGoogle Tag Managerで用意されているクリックした要素を取得する組み込み変数です。

function () {
  return $({{Click Element}}).closest('.abcde').find('h2').text();
}

<section class="abcde">
<h2>取得できたh2の値</h2>
<div class="x"><a href="#">クリックした要素</a</div>
</section>

上の成功例を変更して、今度は特定の親要素のIDの値を取得したいと考えています。

<section class="abcde" id="この値を取得したい">
<h2>取得できたh2の値</h2>
<div class="x"><a href="#">クリックした要素</a></div>
</section>

試してみて失敗した例を下に記述します。

function () {
  return $({{Click Element}}).closest('.abcde').find('id').text();
}

function () {
  return $({{Click Element}}).closest('.abcde').id();
}

上ので取得できると思ったのですが、何の値も返ってきませんでした。
すいません、教えてください。
どうぞよろしくお願いします。

Answer 1

GTMの仕様がよくわからないですが、jQuery的な動作をしているようなので

$({{Click Element}}).closest('.abcde').attr('id');

的な処理でいけませんか？
ちなみにclosestは「親要素」ではなく、「自分自身を含む親要素」なので注意

Comments

[root2]

無事に取得することができました！ありがとうございます！
closestの注意についても、今後気を付けます。