JSFiddle - React, Tailwind, and code Playground

by kizyma_yourquery

HTML

<div class="wrap_question">
    <!--once question-->
    <div class="once_question">
        <h1>Question 1</h1>
        <p>answers for question</p>
        <div class="wrap_answers">
            <!--once answer-->
            <div class="once_answer">
                <h3>Title answer 1</h3>
                <a href="#" class="btn add_new_a">add new answer</a>
            </div>
            <!--once answer-->
        </div>
        <a href="#" class="btn add_new_q">add new question</a>
    </div>
    <!--once question-->
</div>

JavaScript

$(".add_new_q").on('click', function(e){
	
  var once_q = "<div class='once_question'><h1>Question 1</h1><p>answers for question</p><div class='wrap_answers'><div class='once_answer'><h3>Title answer 1</h3><a href='#' class='btn add_new_a'>add new answer</a></div></div><a href='#' class='btn add_new_q'>add new question 2</a></div>";

	e.preventDefault();
  $(".wrap_question").append(once_q);
})