0
<section id="clone_item" class="comment_content reply you">
              <header class="comment_header">
                <img src="assets/images/avatars/image-juliusomo.webp" alt="profile picture" class="comment_header-profile" id="profile_picture">
                <span class="name_profile" id="profile_name">tuvieja</span>
                <p class="time_post" id="post_count">5meses</p>
              </header>
              <main class="comment_main">
                <form>
                  <textarea class="comment_text text_comment_area"  rows="5" cols="33" disabled>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Eum nesciunt amet necessitatibus, eius asperiores veniam accusamus pariatur obcaecati quo doloremque ducimus sint a hic. Eius non ad incidunt similique deleniti?</textarea>
                </form>
                </main>
              <div class="comment_footer">
                <div class="score_count">
                  <button class="button_score">+</button>
                  <span class="score" id="score_rep">0</span>
                  <button class="button_score">-</button>
                </div>
                <div class="container_edit">
                  <button class="done_button-edit done_button">Done!!</button>
                  <button class="delete_button"><img src="assets/icons/icon-delete.svg" alt=""class="icon_reply"><span class="reply_text">Delete</span></button>
                  <button href="#" class="edit_button"><img src="assets/icons/icon-edit.svg" alt="" class="icon_reply"><span class="reply_text">Edit</span></button>
                </div>
              </div>
            </section>

this is the html code and i do this in the .js script.

const cloneChild = document.getElementById("clone_item")
let help=[];
window.addEventListener("load", ()=>{
    let aux=cloneChild.cloneNode(true)
    help.push(aux)
})

sendPost.addEventListener("click", ()=>{
    if(dataPost.value === ""){
        dataPost.classList.add("active")
    }else{
        let aux=help[0];
        aux = cloneChild.cloneNode(true)
        dataPost.classList.remove("active")
        aux.childNodes[3].children[0].children[0].value=dataPost.value
        aux.childNodes[5].children[1].children[2].classList.add("edit_button")
        articleFather.appendChild(aux)
        dataPost.value=""
    } 
})

editElement.forEach((edit_button)=>{
    edit_button.addEventListener("click", ()=>{
        console.log("uwu")
       edit_button.classList.toggle("active")
    })
})

for some reason the code just don't work/affect the dom insertion what i did, any help how anyone can give me?. i click the button of the -div- not cloned and work but in the -div- cloned the code is not working..

JuanMeow
  • 21
  • 3
  • Welcome to Stack Overflow! Please take the [tour] if you haven't already (you get a badge!), have a look around, and read through the [help], in particular [*How do I ask a good question?*](/help/how-to-ask) I also recommend Jon Skeet's [Writing the Perfect Question](https://codeblog.jonskeet.uk/2010/08/29/writing-the-perfect-question/) and [Question Checklist](https://codeblog.jonskeet.uk/2012/11/24/stack-overflow-question-checklist/). – T.J. Crowder Feb 01 '22 at 13:23
  • The code you've shown uses a number of variables that you don't show being created or assigned a value, making it hard to help you because we have to guess at what they are. Please update your question with a [mcve] demonstrating the problem, ideally a **runnable** one using Stack Snippets (the `[<>]` toolbar button); [here's how to do one](https://meta.stackoverflow.com/questions/358992/). – T.J. Crowder Feb 01 '22 at 13:24
  • 1
    Use [event delegation](//developer.mozilla.org/docs/Learn/JavaScript/Building_blocks/Events#Event_delegation) instead of assigning multiple event listeners — it’s more maintainable, and applies to dynamically added elements. E.g., use an [event argument](//developer.mozilla.org/docs/Web/API/EventTarget/addEventListener#The_event_listener_callback)’s [`target`](//developer.mozilla.org/docs/Web/API/Event/target). See [the tag info](/tags/event-delegation/info) and [What is DOM Event delegation?](/q/1687296/4642212). – Sebastian Simon Feb 01 '22 at 13:24
  • Beware that the `section` you're cloning contains elements with `id` values. `id` values must be unique in the document, so adding the cloned `section` will break that rule and likely not do what you want it to do. – T.J. Crowder Feb 01 '22 at 13:25
  • You might want to use [es.so] or [pt.so], if Spanish or Portuguese is your native language. – T.J. Crowder Feb 01 '22 at 13:26

0 Answers0