0

I'm working on a project where I have to delete en element in a certain condition (if). My code generates a <li> in which data is inserted via an array. I need to delete that <li> if some conditions are met.

Since removeParent() doesn't exist I've found different methods saying to use

e.parentNode.parentNode.removeChild(e.parentNode);

Rings a bell, it works in certains cases of course.

BUT

In my case, this is dynamically rendered elements in an array inside the <li> and there is no parent of the parent, so I get an error. My script looks for an element in the <li>, in my test I use a <div> found by its class.

$(node).find('.results-name')[0].parentNode.remove();

Does NOT work unfortunately so I'm looking for other ideas...

Any clue? Thanks a lot!

Thum Choon Tat
  • 3,084
  • 1
  • 22
  • 24
  • Please provide a Minimal, Complete, and Verifiable example. Here's how: https://stackoverflow.com/help/mcve – Pitto Mar 15 '18 at 10:59
  • looks like a mix of native js and jquery - if you are using jquery, why not just do `$('.results-name').parent().remove();` – Pete Mar 15 '18 at 11:24
  • @Pete I've tried that but it doesn't work as I would need to remove only the current parent and not all of the items :/ I've tried mixing with $(node).find('.results-name')[0].parent().remove(); but it won't work ... – Antoine Olbrechts Mar 15 '18 at 11:52
  • ok but you can use jquery? Have you tried without the `[0]`: `$(node).find('.results-name').parent().remove();` – Pete Mar 15 '18 at 11:52
  • @Pete yes if I insert `$('.results-name').parent().remove();` it removes all the results – Antoine Olbrechts Mar 15 '18 at 12:03
  • check my above comment again – Pete Mar 15 '18 at 12:14
  • If I don't use the [0] the script doesn't search for the current result item its populating so it doesn't do anything. – Antoine Olbrechts Mar 15 '18 at 12:17
  • The issue comes from the fact that the parent I want to remove is outside the loop where the javascript populates the page using the template. – Antoine Olbrechts Mar 15 '18 at 12:29

1 Answers1

0

The thing is the code is huge and I can't copy/paste everything here.

Here's more info: - in the page I have a template that's used by the javascript to populate a div with all the contents. I have ~20 results. The template starts like this :

<script id="itemtemplate" type="geowacht/template">
    <div class="results-name">
        <h4 class="show-more-name itemaponaam" data-target="#result"></h4>
            <div class="d-block" id="result">
            <div class="itemaddress"></div>
            <div class="itemgeodesc"></div>
            <div class="itemphone"></div>
  • The pages calls a script that queries an API and returns 20 results. These results are parsed and added to the page using the template. Here's the beginning of the code:

apiconfig.default_populateItemNode = function(node, apotheekData, wachtPeriodeData, authenticationData) { $(node).find('.itemaponaam')[0].setAttribute('data-target', '#result-' + itemPos); $(node).find('.buttons')[0].setAttribute('id', 'result-' + itemPos + '-buttons'); $(node).find('.buttons')[0].setAttribute('data-apbnb', apotheekData.pharmacy.id);