Добавлять и удалять идентификатор при клике по родителю

Question

Не могу понять как добавлять/удалить id="xxx" в теги по клику по родителю с помощью jquery

Код:

<span id="departure">
  <a href="javascript:void(0);" class="selector">
    <span class="selector-left">Отправление</span>
  </a>
</span>

<span id="arrival">
  <a href="javascript:void(0);" class="selector">
    <span class="selector-right" id="selector-right-2">Прибытие</span>
  </a>
</span>

Задача:

$("#departure").click(function()
   {
   удалить у $("#arrival") id="selector-right-2" // <span class="selector-right" id="selector-right-2">Прибытие</span> 
   вставить $("#departure") id="selector-left-2" // <span class="selector-left" id="selector-left-2">Отправление</span>

   });

Answer 1

Можно так

UPD: Исправлено

/*$("#departure").click(function() { 
  $(this).attr({id:"selector-left-2"});
  console.log($(this).attr('id'))
});
$("#arrival").click(function() {
  $(this).removeAttr('id'); 
  console.log($(this).attr('id'))
});*/

$("#departure").click(function() { 
  $('.selector-left').attr({id:"selector-left-2"});
  $('#selector-right-2').removeAttr('id'); 
  console.log($('.selector-left').attr('id'), $('#selector-right-2').attr('id'))
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<span id="departure">
  <a href="javascript:void(0);" class="selector">
    <span class="selector-left">Отправление</span>
  </a>
</span>

<span id="arrival">
  <a href="javascript:void(0);" class="selector">
    <span class="selector-right" id="selector-right-2">Прибытие</span>
  </a>
</span>

БЛОГ НА HUSL

Добавлять и удалять идентификатор при клике по родителю

Ответы (1 шт):