> He probado las soluciones aportadas y todas funcionan. Sin embargo, voy a aprovechar de poner mi grano de arena sobre este tema.
>
> Por otra parte, se coloca la solución al principio para que pueda evaluar los resultados. Luego de eso, lea la explicación más abajo. Le será de mucha ayuda.

## Posible solución

Esta sería una posible solución, pruébela y evalúe sus resultados:

<!-- begin snippet: js hide: false console: true babel: false -->

<!-- language: lang-js -->

    console.clear();

    const parrafos = document.querySelectorAll("p");

    const evaluar = (parrafo) => {
      // Expresión para encontrar el primer guión:
      let expresion = /^(\–)/g;

      // Se obtiene el contenido del parrafo y se elimina el guión:
      let texto = parrafo.textContent.trim();
      parrafo.textContent = texto.replace(expresion, "");
      return expresion.test(texto);
    }

    parrafos.forEach(parrafo => {
      if (evaluar(parrafo)) {
        parrafo.classList.add("padding-left");
      }
    });

<!-- language: lang-css -->

    .cuento p {
      display: block;
      margin-block-start: 1em;
      margin-block-end: 1em;
      margin-inline-start: 0px;
      margin-inline-end: 0px;
    }


    /* Código CSS nuevo */

    .padding-left {
      position: relative;
      padding-left: 30px;
    }

    .padding-left::before {
      content: "–";
      position: absolute;
      margin: auto;
      left: 0;
      padding-left: 15px;
    }

<!-- language: lang-html -->

    <div class="cuento">
      <p>Érase una vez una preciosa niña que siempre llevaba una capa roja con capucha para protegerse del frío. Por eso, todo el mundo la llamaba Caperucita Roja.</p>
      <p>Caperucita vivía en una casita cerca del bosque. Un día, la mamá de Caperucita le dijo:</p>
      <p>– Hija mía, tu abuelita está enferma. He preparado una cestita con tortas y un tarrito de miel para que se la lleves ¡Ya verás qué contenta se pone!</p>

      <p> </p>
      <p>– ¡Estupendo, mamá! Yo también tengo muchas ganas de ir a visitarla – dijo Caperucita saltando de alegría.</p>
      <p>Cuando Caperucita se disponía a salir de casa, su mamá, con gesto un poco serio, le hizo una advertencia:</p>
      <p>– Ten mucho cuidado, cariño. No te entretengas con nada y no hables con extraños. Sabes que en el bosque vive el lobo y es muy peligroso. Si ves que aparece, sigue tu camino sin detenerte.</p>
      <p>– No te preocupes, mamita – dijo la niña- Tendré en cuenta todo lo que me dices.</p>
      <p>– Está bien – contestó la mamá, confiada – Dame un besito y no tardes en regresar.</p>
      <p>– Así lo haré, mamá – afirmó de nuevo Caperucita diciendo adiós con su manita mientras se alejaba.</p>
      <p>Cuando llegó al bosque, la pequeña comenzó a distraerse contemplando los pajaritos y recogiendo flores. No se dio cuenta de que alguien la observaba detrás de un viejo y frondoso árbol. De repente, oyó una voz dulce y zalamera.</p>
      <p>– ¿A dónde vas, Caperucita?</p>
    </div>

<!-- end snippet -->

Sin embargo, necesitamos explicarla.

### Caso CSS

Se crean dos reglas CSS con un selector de clase `.padding-left {}`.

La primera regla es para posicionar los párrafos (`position: relative`) que tienen los guiones y la segunda para colocarle guión que se le quitó con JavaScript. Pero, en la primera regla se agrega el espacio a la izquierda mediante relleno.

Se posiciona el párrafo para que los guiones que se encuentra en el `pseudo-elemento` no se escapen de él.

```css
.padding-left {
  position: relative;
  padding-left: 30px;
}
```

En esta segunda regla CSS utilizamos un `pseudo-elemento` para colocarle el guión:

```css
.padding-left::before {
  content: "–";
  position: absolute;
  margin: auto;
  left: 0;

  /* Se necesita para que el guion (-) 
     no quede muy a la izquierda */
  padding-left: 15px;
}
```

### Caso JavaScript

En JavaScript, lo que haremos es extraer todos los párrafos y averiguar cuáles de ellos empiezan con guión (`–`).

```js
const parrafos = document.querySelectorAll("p");
```

En la función `evaluar( parrafo )` vamos a evaluar el párrafo que pase como parámetro y averiguar si éste empieza con un guión (`–`). De ser así, eliminar el guión y colocarle una clase en su lugar.

La clase que se le colocará es la que le incorporará el espacio hacia la izquierda.

Por ejemplo, dentro de la función `evaluar()` tenemos:

Una expresión regular que definiremos para el encontrar el guión (`–`):

```js
let expresion = /^(\–)/g;
```

Una cadena de texto que extraeremos del párrafo:

```js
let texto = parrafo.textContent.trim();
```

Pero, a esa cadena de texto le quitaremos el guión (`–`) para depurarla y enviarla nuevamente al párrafo:

```js
parrafo.textContent = texto.replace(expresion, "");
```

Y por último, haremos que nuestra función devuelva un `true` o `false` en función de si encuentra o no el guión en el párrafo:

```js
return expresion.test(texto);
```

En cuanto a la expresión regular, el símbolo _circunflejo_ (`^`) significa que debe encontrar el primer elemento. En ese caso, el guión (`–`). Los paréntesis funcionan como signos de agrupación. Esa es su función.

`\–` Es el guión (`–`) que se pretende encontrar.

Si quiere saber más sobre expresiones regulares consule [Expresiones Regulares][expresiones] de la documentación del **Sitio Web Oficial de Mozilla.**

Y para finalizar, iteramos los párrafos para evaluarlo:

```js
parrafos.forEach(parrafo => {
  ...
});
```

Evaluarmos el párrafo con nuestra función `evaluar()`:

```js
if (evaluar(parrafo)) {
  ...
}
```

Y le aplicamos la clase al párrafo que tiene el guión (`–`) para asignarle el espacio requerido:

```js
parrafo.classList.add("padding-left");
```

[expresiones]: https://developer.mozilla.org/es/docs/Web/JavaScript/Guide/Regular_Expressions "Expresiones regulares | MDN Web Docs"