Why is my custom plugin not working after accidentally deleting a different plugin?

I accidentally deleted a plugin called WP File Manager that seems to only allow me to access my websites files via the WordPress dashboard. After I deleted it, a custom plugin I have stopped functioning properly. The custom plugin is for a shortcode to generate a JS table that is editable by the user which will divide some nutritional information by how many servings they want. I have included the .php .js and .css files that make up the plugin below. If you could help me figure out what is happening i would appreciate it!!

It looks like this when functioning properly:

Currently, all of the pages that have this specific shortcode on the page look like this(below) and nothing happens when you update the number in the Servings column:

Here is my .php code

<?php
    function ls_nutritional_table_resources() {
global $post;
if( is_a( $post, 'WP_Post' ) && has_shortcode( $post->post_content, 'nutrition_table') ) {
    wp_register_style( 'ls-nutritional-table-css',  plugin_dir_url( __FILE__ ) . 'nutritional-table.css' );
    wp_enqueue_style( 'ls-nutritional-table-css' );

    wp_enqueue_script('ls-nutritional-table-js', plugin_dir_url( __FILE__ ) . 'nutritional-table.js' );
}
 }
  add_action( 'wp_enqueue_scripts', 'ls_nutritional_table_resources');

  add_shortcode('nutrition_table', 'ls_nutritional_table');

  function ls_shortcodes() {
   function ls_nutritional_table($atts) {
    $attributes = shortcode_atts(array(
        'servings' => '1',
        'carbs' => '100',
        'protein' => '400',
        'fats' => '90',
        'calories'=> '2810'
    ), $atts);

    $output = '<div class="nutrition-table">
    <div class="nutrition-table__column">
    <div class="nutrition-table__head">Servings</div>
    <div class="nutrition-table__content">
        <input type="number" value="' . esc_html($attributes['servings']) .  '" min="1" autocomplete="off" class="nutrition-table__number">
    </div>
    </div>
    <div class="nutrition-table__column">
    <div class="nutrition-table__head">Carbs</div>
    <div class="nutrition-table__content nutrition-table__content--carbs">' . esc_html($attributes['carbs']) .  'g</div>
    </div>
    <div class="nutrition-table__column">
    <div class="nutrition-table__head">Protein</div>
    <div class="nutrition-table__content nutrition-table__content--protein">' . esc_html($attributes['protein']) .  'g</div>
    </div>
    <div class="nutrition-table__column">
    <div class="nutrition-table__head">Fat</div>
    <div class="nutrition-table__content nutrition-table__content--fat">' . esc_html($attributes['fats']) .  'g</div>
    </div>
    <div class="nutrition-table__column">
    <div class="nutrition-table__head">Calories</div>
    <div class="nutrition-table__content nutrition-table__content--calories">' . esc_html($attributes['calories']) .  ' cals</div>
    </div>
</div>';

 return $output;
  }
 }

 add_action('init', 'ls_shortcodes');

 ?>

Here is my .js code

var NutritionTablesPlugin = (function() {

'use strict';

/**
 * Create the Constructor object
 */
var Constructor = function(selector) {

    //
    // Variables
    //

    var publicAPIs = {};

    var nodes = document.querySelectorAll(selector);

    //
    // Methods
    //
    var allNodes = function(callback) {
        for (var i = 0; i < nodes.length; i++) {
            callback(nodes[i], i);
        }
    };

    /**
     * A private method
     */
    var updateNutritionValues = function(table, multipler, macros) {
        var carbs = table.querySelector('.nutrition-table__content--carbs');
        var protein = table.querySelector('.nutrition-table__content--protein');
        var fat = table.querySelector('.nutrition-table__content--fat');
        var calories = table.querySelector('.nutrition-table__content--calories');

        carbs.textContent = (macros.carbs / parseInt(multipler)).toFixed(1) + 'g';
        protein.textContent = (macros.protein / parseInt(multipler)).toFixed(1) + 'g';
        fat.textContent = (macros.fat / parseInt(multipler)).toFixed(1) + 'g';
        calories.textContent = (macros.calories / parseInt(multipler)).toFixed(0) + ' cals';
    };


    /**
     * Another public method
     */
    publicAPIs.init = function(options) {
        allNodes(function(node) {

            var originalValues = {
                carbs: parseInt(node.querySelector('.nutrition-table__content--carbs').textContent),
                protein: parseInt(node.querySelector('.nutrition-table__content--protein').textContent),
                fat: parseInt(node.querySelector('.nutrition-table__content--fat').textContent),
                calories: parseInt(node.querySelector('.nutrition-table__content--calories').textContent)
            };

            node.addEventListener('change', function(e) {
                updateNutritionValues(node, parseInt(e.target.value), originalValues);
            });
        });
    };

    //
    // Return the Public APIs
    //
    return publicAPIs;
};

//
// Return the Constructor
//
return Constructor;

})();

document.addEventListener("DOMContentLoaded", function(event) {
    var nutrition = new NutritionTablesPlugin('.nutrition-table');
    nutrition.init();

});

Here is my .css code

.nutrition-table {
display: flex;
flex-flow: row wrap;
width: 100%;
max-width: 740px;
margin: 20px auto;
border: 1px solid black;
}
  .nutrition-table__column {
    flex: 1;
    border-right: 1px solid black;
   }
  .nutrition-table__column:last-child {
    border-right: none;
   }
  Traversy Media screen and (max-width: 740px) {
   .nutrition-table__column {
     flex: 0 0 100%;
   } 
  }
  .nutrition-table__head {
    padding: 8px 0;
    background: #474b56;
    font-weight: bold;
    font-size: 14px;
    color: white;
    text-align: center;
    text-transform: uppercase;
  }
  .nutrition-table__content {
    display: flex;
    justify-content: center;
    padding: 8px 0;
    font-weight: bold;
    color: black;
  }
  .nutrition-table__number {
    width: 60px;
  }