One of two removeChild in the same block is not working

I am having trouble figuring out why only one of the following removeChild methods seems to work when the block is run. I just can’t get the table1header element to be removed at the same time as the tbodyid element. in Chrome, if i copy and paste into the console the two lines where i declare elem and remove elem it the table1header gets removed like i want it to be. i tried swapping the order in the code but tbodyid gets removed and table1header does not.

  if (elementExists) {
    console.log("table1header exists");
    let elem1 = document.getElementById("tbodyid");
    elem1.parentNode.removeChild(elem1);
    console.log("table body removed");
    let elem = document.getElementById("table1header");
    elem.parentNode.removeChild(elem);
    console.log("table header removed");
  }

Here is a link to the full code at CodePen: https://codepen.io/dzamora54/pen/jOWVBBp

It would help if you explain how we can test your code. What are the steps to recreate the problem. You have almost 1000 lines of code, so explaining the user steps to see the issue will speed up the discovery process on our end.

Thank you.

Sorry. I should have include that. To recreate the situation what I am trying to do is dynamically modify or delete a table.

To create the table, click on the button labeled “Add Day 1 Non-Doc Markets” and check any number of checkboxes and click the button “Save Markets”.

Reopening the same modal and changing the checkboxes modifies the content in the table.

If I uncheck all boxes and “Save Markets”, I want the table to disapear. If i open the modal later, check boxes and “Save Markets” then I want a new table to be created using data based on the checked boxes.

Hello,
I couldn’t find any error in your removeChild calls, so I run the CodePen with the debugger and indeed both removeChild statements are working fine. When line 887 ( the Hola log statmente) is reached both elements are gone.
I think the error is later in the code and the header gets recreated event if nothing has been selected in the popup.

If you need more help just tell and I will take a deeper look.

// Gerrit

1 Like

It does remove it. But generateTableHead adds it back and then you get a reference error when you try to access the properties on tbody because it is null.

1 Like

Thanks. I’ll use this to rethink how to approach and accomplish what I want to do.