Bascule qui remplace un <div> par un <pre> ou vice-versa, tout en conservant le contenu à l'intérieur.

<div id="toggleContainer">
	<div id="content">Ceci est le contenu à l'intérieur de l'élément.</div>
</div>
<button id="toggleButton">Bascule</button>

<script>
	document.getElementById('toggleButton').addEventListener('click', function() {
		const container = document.getElementById('toggleContainer');
		const currentElement = container.firstElementChild;
		const newElement = document.createElement(currentElement.tagName === 'DIV' ? 'pre' : 'div');
		newElement.id = 'content';
		newElement.textContent = currentElement.textContent;
		container.replaceChild(newElement, currentElement);
	});
</script>