How to reload js document?

Question

Python

Good day!

I have an HTML document that fetches a list from the database using AJAX.
Certain scripts are attached to this list when hovering over an element of the list.

Also on the site there are functions for adding new list items by entering them into the database. Next, the old list displayed in HTML is removed and a new updated one is displayed.

But after that, the scripts stop working when hovering over the list items.

As I understand it, this is due to the fact that the DOM tree has been changed, and it does not see new elements, as it were.
This begs the question, how can I make the JS script see new elements without reloading the page?

Thank you all in advance!

Answer 1

I didn’t quite understand what exactly I need to get - the name of all friends, the name of the contact itself, or both of them in a bunch?
Next resp is your dictionary

names = []
contacts = resp['data']['user']['contact_list']
for contact in contacts:
    contact_name = contact['name']
    friends_names = [x['name'] for x in contact['friends']]
    names.append(contact_name)
    names.extend(friends_names)

I think you will figure out exactly what name you needed

Answer 2

This begs the question, how can I make the JS script see new elements without reloading the page?

The easiest way is to use something like:

$(document).on('mouseover', '.element_class', function(){
    doSomeStuff();
})

that is, hang an event handler on the document and track the class that falls into the event. It is recommended only in the case of dynamic creation of elements, so as not to litter the global property of the document with unnecessary listeners.