Добрый день,
Нужно динамичски добавить следующий HTML

<p class="planning-area-tag-content">
   <span class="planning-area-site">
        Some Text 
   </span> 
   <span class="planning-area-delemiter">|</span>
   <span class="planning-area-name">
      Some Text
   </span>
</p>

Пытаюсь так, но ничего не получается

let resElement = $('p').addClass('planning-area-tag-content')
    .add('<span>').text('Some Text').addClass('planning-area-site')
    .after('<span>').text('|').addClass('planning-area-delemiter')
    .after('<span>').text('Some Text').addClass('planning-area-name');

Подскажите пожалуйста.
Спасибо