let test = document.querySelectorAll('#tabs');

	test[0].parentElement.parentElement.outerHTML = '<div class="zalupa">'+ test[0].parentElement.parentElement.outerHTML +'</div>';

	console.log( document.querySelectorAll('#logotype')[0].closest('#mainHeader') ); // work

	console.log( test[0].parentElement.parentElement.parentElement ); // zalupa null

	console.log( test[0].closest('.zalupa') );	// zalupa null

<div id="shell">
		<header id="mainHeader">
			<h1 id="logotype">
				<a href="#" data-title="and add">adds</a> 
				:: <span>asdasdasdsad</span></h1>
		</header>
	</div><!--#shell-->

	<div id="testElements">
		
		<section style="text-align: center; width: 980px; margin: 0 auto">
			<aside id="tabs" class="tabs">
				<ul>
					<li data-link="tab-1">1</li>
					<li class="activetab" data-link="tab-2">2</li>
					<li data-link="tab-3">3</li>
				</ul>

				<div data-content="tab-1">Tous mes rêves se réalisent.</div>

				<div class="tabactive" data-content="tab-2">Si on vit sans but, on mourra pour rien.</div>

				<div data-content="tab-3">Jouis de chaque moment.</div>

			</aside>
		</section>
</div>

let test = document.querySelectorAll('#tabs');

	let zalupa = document.createElement('div');

	zalupa.classList.add('zalupa');

	zalupa.innerHTML = test[0].parentElement.parentElement.outerHTML;

	test[0].parentElement.parentElement.outerHTML = zalupa.outerHTML

	console.log(test[0].closest('.zalupa')); // zalupa null

var test = document.querySelectorAll('#tabs');
var parent = test[0].parentElement.parentElement;
var newParent = document.createElement('div');
newParent.className = 'zalupa';
parent.parentNode.replaceChild(newParent, parent);
newParent.appendChild(parent);

for(let i of e) {

			let parent = i.parentElement;
		
			while (i.firstChild) {
				parent.insertBefore(i.firstChild, i);
			}

			parent.removeChild(i);
		}

i.outerHTML = '<div class="wrapper">'+ i.outerHTML +'</div>';

let element = document.querySelectorAll('#shell');

element[0].querySelectorAll('.somethin-in-shell');

let element = document.querySelectorAll('#shell');

element[0].querySelectorAll('*'); // вообще все что внутри

for(let i of e) {

			let parent = i.parentElement;
		
			while (i.firstChild) {
				parent.insertBefore(i.firstChild, i);
			}

			parent.removeChild(i);
		}

i.outerHTML = '<div class="wrapper">'+ i.outerHTML +'</div>';

var elem = document.querySelector('#id1');
var range = document.createRange();
range.selectNodeContents(elem);
elem.parentNode.replaceChild(range.extractContents(), elem);

this.wrapper = document.createElement('div');

this.wrapper //-> вот она, ссылка на элемент.

document.querySelector('#button').onclick = function() {
    document.querySelectorAll('.foo .bar')[0].style.display = 'none';
};

//Не правильно
$('#button').on('click', function() {
   $('.block-1').css('display', 'block');
   $('.block-1').css('color', 'red');
   $('.block-2').html('Bla');
});


//Правильно
var block_1 = $('.block-1'),
   block_2 = $('.block-2');

$('#button').on('click', function() {
   block_1.css({display: 'block', color: 'red'});
   block_2.html('Bla');
});

document.querySelectorAll('#shell .somethin-in-shell')

Даже если рассматривать Ваш пример, то тут очень много противоречий.

1. id уникален, он должен быть только один на странице. Следовательно, запись document.querySelectorAll('#shell') не имеет смысла, так как мы хотим получить один единственный элемент, а не коллекцию. Получается, что лучше тогда использовать document.querySelector (без "All"), но опять же, куда быстрее и правильней будет заюзать document.getElementById.

2. Нет смысла в два шага искать элементы с определённым классом внутри элемента с определённым id. Можно сразу:
document.querySelectorAll('#shell .somethin-in-shell')

Но это если конечно Вам не нужны оба элемента.