sergski

1. получить длинну let pos = value.length;
   
2. в ваш цикл forEach в условии совпадения взять подстроку из elem от 0 до pos и записать в переменную
   
3. обернуть значение этой переменной в span
   
4. взять подстроку из elem от pos до конца строки и записать в переменную
   
5. сложить эти две переменные и присвоить elem
   
6. добавить в css a > span {background: yellow}
   

<select class="select2" name="option[]" multiple="multiple">

$('.select2').select2().on('change.select2', function(e) {
    let count = $(this).select2('data').length; 
    if(count == 3) {
        $(this).prop( "disabled", true );
    }
});

let getVal = undefined;

$('select').select2().on('change.select2', function(e) {
    getVal = e.target.value;
});

if ( getVal == 'option1') {
	// делаем видимым текст1 
}

.done(function(data) {
     if (data){
        // убрать disabled у кнопки
     });

const checks = document.querySelectorAll('input.form-check-input')

checks.forEach(c => c.addEventListener('click', onClick));

function onClick() {
                      
  const res = [...checks].filter(c => c.checked);
  
  if ( res.length === 3 ) {
    const url = 'http://site.ru' + res.map(c => c.value).join('');
    location.href = url;
  }
}

let currTop = $('#'+id).offset().top;
$('body,html').animate({"scrollTop": currTop}, 1500);