JSFiddle - React, Tailwind, and code Playground

by kiokotzu

HTML

<h2>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Inventore, magni, alias animi ab dolores beatae soluta dicta necessitatibus eius saepe rem maiores vel veniam et asperiores iste deserunt unde eaque.</h2>

<h2>Esteban Vera</h2>

<h2>probando ciclo</h2>

CSS

body{background:#f1f1f1}
h2{color:#333;}
h2 span{color:red;}

JavaScript

$(function(){
/*- ESTE CODIGO SE PUEDE UTILIZAR SIN LA FUNCIÓN PINTAR_TEXTO() LO UNICO QUE TENDRIA QUE HACER ES COPIAR TODO LO QUE TIENE ESTA FUNCIÓN Y PEGARLO DENTRO DEL CICLO FOR).
            
PERO LO DEJO DE ESTA FORMA CON UNA FUNCIÓN PARA QUE SI EN ALGÚN CASO TENGA QUE HACE ESTE MISMO EJERCICIO EN OTRA SECCION DE LA PÁGINA O INTERNA SOLO TENGA QUE LLAMAR LA FUNCIÓN Y NADA MÁS, Y NO TENER QUE VOLVER A COPIAR TODO EL CODIGO Y REPETIR TAREAS QUE SE PUEDEN SOLUCIONAR GUARDANDOLAS EN UNA FUNCIÓN-*/

/*- guardamos la etiqueta h2 en una variable -*/
  var titulos = $('h2'); 

/*- Hacemos un ciclo que se repitan por la cantidad de h2 que hallan "para eso utilice el .length de vuelve la cantidad de elementos de ahí iguales al elemento que le estamos pasando en este caso la variable titulos"-*/
  for (var i = 0; i < titulos.length; i++) {

/*- llamamos la función pintar_texto() que no resibe ningun parametro -*/
    pintar_texto();
  };


/*- función pintar_texto()-*/ 
  function pintar_texto(){

/*- guardamos el texto del h2 en una variable dependiendo de la posición en la que se encuentre el ciclo (for) "por eso le paso eq(i) 'i' es la variable que va aumentado en el ciclo" -*/
     texto = $('h2').eq(i).text();

/*- declaramos una varible que va a ser igual a la variable 'texto' que se de claro anteriormente y esta nueva variable le pasamos .split() sirve para convertir un texto en un array y para separaros en las posiciones de array le pasamos .split(" ") con esto le estamos diciendo que por cada espacio que encuentre en el texto lo guarde en una nueva posicion en el array-*/
	  nuevoTexto = texto.split(" ");

/*- En esta variable estamos guardando la ultima palabra del texto, en este caso la ultima posicion del array, le coloco nuevoTexto.length -1, ¿por que el -1?.
por que cuando pasamos .length a una variable nos va contar la cantidad empezando desde 1 y ahí que tener en cuenta que un array las posiciones siempre empiezan desde 0-*/
	  ultimoElemento =...