I want to learn JavaScript. I know jQuery is a library to JavaScript but the syntax is so different and I just need some help reading what the code is doing so that I can recreate it using JavaScript.

I am working on a project from a youtube tutorial that adds items to a WebSQL database usig jQuery Mobile I am at a point in the tutorial where we are updating an item we entered. The code is able to populate the update form with the information we entered. The code works perfectly but it's in jQuery and I wanted to change it to JavaScript if possible. Can you help me by explaining what the code is actually doing and how to convert it to JavaScript?

HTML code of the update form

```
       <div data-role="header">
           <h1>Update Product</h1>
       </div>
       <div data-role="main" class="ui-content">
           <form>
               <div class="ui-field-contain">
                   <label for="newName" class="ui-hidden-accessible">Name</label>
                   <input type="text" id="newName" data-clear-btn="true" placeholder="New Name"/><br/>
                   <label for="newQuantity" class="ui-hidden-accessible">Quantity</label>
                   <input type="number" name="number" pattern="[0-9}" id="newQuantity" value="" data-clear-btn="true" placeholder="New Quantity"/><br/>
                   <button class="ui-btn ui-icon-plus ui-btn-icon-left"
                           id="btnupdate" onclick="updateProduct()">Update</button>
               </div>
           </form>

       </div>
````    </div>

JavaScript Code of populating the form and then updating the changes.

````var currentProduct = {
  id:-1,
  name: "",
  quantity:-1,
````}

````$(document).on('pagebeforeshow', '#updatedialog', function() {
 $('#newName').val(currentProduct.name);
 $('#newQuantity').val(currentProduct.quantity);
});

function updateProduct() {
 var newName = $('#newName').val();
 var newQuantity = $('#newQuantity').val();
 productHandler.updateProduct(currentProduct.id, newName, newQuantity);
}

```

```
    databaseHandler.db.transaction(
        function(tx){
            tx.executeSql(
            "Update product set name=?, quantity=? where id=?",
             [newName, newQuantity, _id],
              function(tx, results){},
               function(tx, error){//todo: display this message to user
                    console.log("Error updating product" + error.message);
                 }
               );
        }
    );
}

```

I would like to populate the update form with the product info, change any info on the form and update the information using JavaScript not jQuery.