Как получить все элементы на странице и первое слово обернуть в span?

Question

[Константин]

На странице имеется несколько элементов вида <a class="doc" href="">Новый текст текст</a>.

Необходимо у каждого первое слово обернуть в span.

Я сломался на этапе получения содержимого тега:

let arr = document.querySelectorAll('.doc');
		
		for (let i = 0; i < arr.length; i++) {
		 
			console.log([i].innerHTML)
		}