Grocery-List | SMS Grocery List service using Twilio | SMS library

I want to take the item written in the input field and add it to the below list once the button is hit. The way I do it is wrong as the event only append empty li

HTML:

I want to let a user check off whether they've "acquired" a grocery item and update the Database.

In more concrete terms, when a user checks a box, I want to toggle a Boolean property acquired on an ingredient object. Ingredients are stored in an array on the GroceryList document:

Here is the Schema for a Grocery List

Essentially, I'm rendering a couple of notes from a notes[] array to my page and adding a button to each note that, when clicked, will remove the note from the array using splice(), then re-render the remaining notes. The button is given an id based on the title of the note (given as input by a user), which is also given a similar id.

This is just some Vanilla JS for a personal project and after looking around this morning I've yet to find a solution that doesn't deal with Vue, Angular, or some other framework/package.

This is the relevant HTML:

I'm using as the main outlet in my application.

In one of the pages .html I have several navigation buttons and a , because I want to render the result of clicking those buttons to the .

At route level that page has child routes:

I am trying to display data from MySQL via Flask-SQLAlchemy query and change foreign key (category_id) into name assign to the category_id. To be more precise -

With the query I want to display item with the name from category Table, not the category_id.

Here is my code:

I have a list, and I want to get the value of the list item.

The view is as follows