JSFiddle - React, Tailwind, and code Playground

HTML

<div data-term="A" class="selector"></div>
<div data-term="B" class="selector"></div>
<div data-term="C" class="selector"></div>
<div data-term="D" class="selector"></div>
<div data-term="E" class="selector"></div>
<div data-term="F" class="selector"></div>

<div class="site" data-source="http://url.com/?query=">x</div>
<div class="site" data-source="http://url.com/?query=">y</div>
<div class="site" data-source="http://url.com/?query=">z</div>

JavaScript

var terms = $('.selector').map( function() {
    return $( this ).data('term');
}),chunks;

var index = 0;
while (terms.length > 0) {
    chunks = terms.splice(0,2);
    var see = chunks.join('|');
    $('.site').eq(index).attr('data-source',function(i,v){
       return v + see; 
    });
    index++;
    }