I got a little problem with php/js. I want to create a website for a school project which is a communotary food receipe oriented website. And here I'm struggling with my page 'submit receipe'.

To be exact the problem is that I create, with a button, some dynamic textarea in order to represents the steps of a receipe, to do so I use a js eventHandler. And here I have a problem because I want to insert in this js code the post value that the user has typed. But I honestly don't know how to do this, I get the fact that js is executed before php so do I have a solution to bypass this problem ?

Here my code :

// The js script
function createNewElement() {
    var txtNewInputBox = document.createElement('div');
    var php = "<?php if(isset($_POST['boxExplain_" + numStep + "']))echo $_POST['boxExplain_"+ numStep + "']?>";
    
    txtNewInputBox.innerHTML = "<label for='box-explain'>Step " + numStep + "</label>"+
                              "<br>"+
                              "<textarea type='text' class='box-explain' name='boxExplain_" + numStep + "'" + 
                                      "value='' placeholder='BlaBla.'>" +
                                      php + "</textarea>" +
                              '<i class="fas fa-minus-circle '+ numStep +'"></i>';
   numetape++; 

    document.getElementById("step-box").appendChild(txtNewInputBox);
}

And here the HTML :

<div class="explain-box">
                <h3>Explanations </h3>
                <label for="box-explain">Step 1</label>
                // The first one is not dynamic
                <textarea type='text' class='box-explain' name='boxExplain_1' value="" placeholder="BlaBla"><?php if (isset($_POST['boxExplain_1'])) echo $_POST['boxExplain_1'] ?></textarea>
                
                //here goes the js one
                <div id="step-box"></div>
                <div id="dynamicCheck">
                    <input class="btnStep" type="button" value="add Step" onclick="createNewElement();" />
                    <i class="fas fa-plus"></i>
                </div>
            </div>

I hope it was clear enough, thanks for your help.