Crear un cuestionario de forma dinamica en Javascript

necesito crear un formulario dinámico que agregue nuevas preguntas y luego permita agregar respuestas a cada una de esas preguntas.
Actualmente este es el código que tengo en funcionamiento, con el cual logro agregar y eliminar respuestas correctamente, pero, lo que no he podido lograr aún es agregar nuevas preguntas para luego agregar respuestas específicamente a las preguntas que uno desee.

Un ejemplo del problema es:
Tengo 2 preguntas y deseo agregar nuevas respuestas sólo a la pregunta 2. Lo que sucede es que las nuevas respuestas que agrego pasan a formar parte de la pregunta 1 siempre (no de la pregunta 2 como deseo).

Vista.html

<form action="">
  <div class="form-group row">
  <div class="col-md-8 offset-md-2">
     <input type="text" name="encuesta" id="encuesta" placeholder="Nombre 
         encuesta" class="form-control">
  </div>
  </div>
  <div id="contenedor_todo">
  <div id="pr_0">
     <div class="form-group row">
        <div class="col-md-8 offset-md-2">
           <input type="text" name="preguntas" id="preguntas" 
            placeholder="Pregunta" class="form-control">
        </div>
     </div>
  </div>
  <div id="contenedor_respuestas">
     <div class="tr_0">
        <div class="form-group row">
           <div class="col-md-6 offset-md-2">
              <input type="text" name="respuestas" id="respuestas" 
               class="form-control" placeholder="Respuestas">
           </div>
           <div class="col-md-2">
              <button class="btn btn-light" type="button" 
              onclick="agregarCampo();"><i class="fas fa-plus- 
              circle"></i></button>
              <button class="btn btn-light" type="button" 
              onclick="quitarCampo();"><i class="fas fa-minus- 
              circle"></i></button> 
           </div>
        </div>
     </div>
  </div>
  </div>
  <div class="input-group-prepend text-center offset-lg-5">
  <button class="btn btn-light" type="button" 
  onclick="agregarCampoP()">Agregar pregunta</button>
  <button class="btn btn-light" type="button" onclick="">Quitar 
  pregunta</button> 
  </div>
  </form>

funcion.js

var campos = 0;
var campos2 = 0;

//agregar respuestas
function agregarCampo() {

//Limita a generar 5 respuestas max.
if (campos < 4) {
    campos = campos + 1;

    var NvoCampo = document.createElement("div");
    NvoCampo.id = "tr_" + (campos);
    NvoCampo.innerHTML =

     '<div class="form-group row">' +
        ' <div class="col-md-6 offset-md-2">' +
        '<input type="text"  name="respuestas'+ campos+'" class="form- 
     control"  id="respuestas'+ campos+'" placeholder="Otra respuesta">' +
    '</div>'+
        '</div>';



    var contenedor = document.getElementById("contenedor_respuestas");

    contenedor.appendChild(NvoCampo);
 }
}

//quitar respuestas
function quitarCampo(textbox) {


if (campos > 0) {

    var eliminar = document.getElementById("tr_" + campos);
    var contenedor = document.getElementById("contenedor_respuestas");

    contenedor.removeChild(eliminar);
    campos = campos - 1;


}
}

//agregar preguntas nuevas
function agregarCampoP() {

//Limita a generar 5 preguntas max
if (campos2 < 4) {
    campos2 = campos2 + 1;

    var NvoCampo2 = document.createElement("div");
    NvoCampo2.id = "pr_" + (campos2);
    NvoCampo2.innerHTML =

    '<div class="form-group row">' +
        ' <div class="col-md-6 offset-md-2">' +
        '<input type="text" name="preguntas'+ campos2+'" id="preguntas'+ 
    campos2+'" placeholder="Pregunta" class="form-control">' +
    '</div>'+
        '</div>'+
        '<div class="form-group row">'+

        '<div class="col-md-6 offset-md-2">'+
        '<input type="text" name="respuestas" id="respuestas" class="form- 
         control" placeholder="Respuestas">'+

        '</div>'+
        '<div class="col-md-2">'+
              '<button class="btn btn-light" type="button" 
               onclick="JavaScript:agregarCampo();"><i class="fas fa-plus- 
               circle"></i></button>'+
              '<button class="btn btn-light" type="button" 
               onclick="JavaScript:quitarCampo();"><i class="fas fa-minus- 
          circle"></i></button>'+
        '</div>'+
        '</div>';

    var contenedor2 = document.getElementById("contenedor_todo");

    contenedor2.appendChild(NvoCampo2);
}

    const preguntas =[];

    class Pregunta{

            constructor(enunciado,respuesta=undefined){
                  this.enunciado=enunciado;
                  this.respuesta=respuesta;
            }
            agregarRespuesta(respuesta){
                   this.respuesta = respuesta;
           }
    }

      function crearPregunta(enunciado,respuesta){
//La respuesta la puedes agregar después
//Simplemente accedes al método agregarRespuesta de el objeto
                     preguntas.push(new Pregunta(enunciado,respuesta));
    }

    funtion obtenerPreguntas(){

    //Recorrer todo el arreglo con las preguntas que se han creado
              for(let i in preguntas){
                       const pregunta = preguntas[i]
                       const enunciado = pregunta.enunciado;
                       const respuesta= pregunta.respuesta;

                       /*Y listo ahora solo agregas una función que te agregue los enunciados y las respuestas al HTML*/

                       //Por ejemplo:

                      //El último argumento es el número de la pregunta 
                      //mostrarPregunta(enunciado,respuesta,i+1)
             }
    }`



//Ejemplo

//Crea la pregunta 
crearPregunta("¿Qué es un byte?");

//Agregas una respuesta
preguntas[0].agregarRespuesta(/*respuesta aquí*/);


//Y por último las imprimes
obtenerPreguntas();