Putting spaces between every character

by Lloyd Atkinson

HTML

<label>
  Putting spaces between every character
  <input id="input" type="text">
</label>
<button id="add">
  OK
</button>
<div id="output">

</div>

JavaScript

// Here declare the elements we need access to.
const inputField = document.querySelector('#input');
const addButton = document.querySelector('#add');
const output = document.querySelector('#output');

// We create a seperate function for manipulating the text, we don't need to access the DOM here.
const addSpacesToString = (text, numberOfSpaces = 10) => {
	const spaces = ' '.repeat(numberOfSpaces);

	const spacedText = text
  	.split('')
    .join(spaces);
    
  return spacedText;
};

const updateUI = () => {
	const spacedText = addSpacesToString(inputField.value);
  
  output.innerText = spacedText;
};


addButton.addEventListener('click', () => {
	updateUI();
});