How do I have a function find two elements? [duplicate]

Question

I'm a beginner with JavaScript so I'm sure this will be an elementary question.

With this function below, I want it to find the two elements and add them to a header element. Right now, the only thing that is working is the element, the link with the rel:author tag. I'm sure this is probably a syntax thing.

(function($) {
  $(document).ready(function() {
    $(".single .single-post-module").each(function() {
      $(this).find('a[rel="author"]', 'span[class="updated"]').clone().appendTo($(this).find('.post-header h1'));
      //            ^^^
    });
  });
})(jQuery)

Edit: I'm using Divi on wordpress and the site is in maintenance mode. That's why didn't show the HTML or give a link.

Answer 1

This could be done with pure Javscript querySelectorAll with an CSS selector that will find both elements.

To clone the element, use cloneNode(true) where the first parameter indicates to clone 'deep'

const header = document.querySelector('.post-header > h1');

const elements = document.querySelectorAll('.single, .single-post-module');
Array.from(elements).forEach(e => header.append(e.cloneNode(true)));

<div class='single'>
    <a rel='author'>Link</a>
    <span class='updated'>Span</span>
</div>

<div class='single-post-module'>
    <a rel='author'>Link</a>
    <span class='updated'>Span</span>
</div>

<div class='post-header'>
  <h1></h1>
</div>