jQuery выберите следующий элемент div

Question

структура:

<div id="XY">
    <p>Test</p>
    <ul>
       <li>Test<a class="link"></a></li>
    </ul>
</div>

Моя цель - получить идентификатор div и вставить его в ссылку элемента "link".

    <script>
    $(document).ready(function() {
        $(".link").attr("href", "open_" + $(this).parent("div").attr('id'));
    });
    </script>

Answer 1

Чтобы получить id из div, вы можете использовать метод parents() по ссылке:

$(document).ready(function() {
     $(".link").attr("href", "open_" + $('.link').parents("div").attr('id'));
     console.log($('.link').attr('href'))
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="XY">
     <p>Test</p>
     <ul>
          <li>Test<a class="link"></a></li>
     </ul>
</div>

Answer 2

Вы можете сделать это так:

$(document).ready(function() {
  $(".link").attr("href", "open_" + $(".link").closest("div").attr('id'));
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="XY">
    <p>Test</p>
    <ul>
       <li>Test<a class="link"></a></li>
    </ul>
</div>

Если у вас есть дополнительные ссылки, для которых это применимо, просто используйте each():

$(document).ready(function() {
   $(".link").each(function() {
      $(this).attr("href", "open_" + $(this).closest("div").attr('id'));
   });
});