How can I insert data with a conditional loop?

Change the query to a conditional cycle

const api = "https://rickandmortyapi.com/api/character";fetch(api)  .then((response) => response.json())  .then((data) => {    console.log(data);    data.results.forEach((element) => {      let character = document.createRange().createContextualFragment(        `<img src="${element.image}" alt="" srcset=""><h2>Nombre:${element.name}</h2><p>Status: ${element.status}</p>    `      );      const div = document.getElementById("personajes");      div.appendChild(character);    });  });

My intention is to perform this part of the code but with a conditional loop.

    data.results.forEach((element) => {      let character = document.createRange().createContextualFragment(        `<img src="${element.image}" alt="" srcset=""><h2>Nombre:${element.name}</h2><p>Status: ${element.status}</p>    `      );      const div = document.getElementById("personajes");      div.appendChild(character);    });

The detail is that when I did it with a cycle, it only brought me one data, which the idea is to be able to bring all the data.