Modificar texto capturado com window.getSelection

Boa noite

Gostaria de saber como se faz para modificar um texto capturado pelo método window.getSelection.

Eu consigo com o javascript pegar a seleção e retorna ela num alert ou dentro de uma div por exemplo mas não consigo aplicar css nela.

Meu código



		<style>
		       #teste{
			    border:solid 1px;
				padding:30px;
			   }
		</style>
		
  </head>
  
  <body>
        <h1>Olá mundo!</h1><br>
		
		<button onclick="seleção()">Clique!</button><br><br>
		
		<div id="teste">
		</div>
		
		<script>
		
		function seleção(){
			  
			  
			  var selecao = window.getSelection();
			  alert(selecao);
			  //selecao.style.color = "#ff0000"; não consigo aplicar css !!!
			  
			  document.getElementById("teste").innerHTML =  selecao;
			  
		}
	   
	   </script>
  
  </body>

Só é possivel aplicar estilos em elementos HTML, e sua variável selecao é uma String.
Você deve aplicar o estilo no elemento que contem o conteúdo dessa sua variável. Nesse caso, o elemento `id=“teste”.

Isso deve funcionar e vai ter exatamente o resultado que você quer:
document.getElementById("teste").style.color = '#ff0000'