I created plenty of boxes in my html page, however I want the boxes to already text inside them that can be changed. basically what i mean is the boxes that I already have are blank, when I input text in the boxes their values change, but what I want is for the boxes to have original text values inside them that can be changed, here is what I have so far... thanks for the help guys,

```
<html>
<head>
        <title>
            COMSC-100-5066 Assign.10 by Harrash Naemi  | 12164128
        </title>

    <script>
        function getInputAsText(_id){return document.getElementById(_id).value}
        function getInputAsNumber(_id){return parseFloat(document.getElementById(_id).value)}
        function setOutput(_id, _value){document.getElementById(_id).value = _value}

        function calculate()
        {
         // declare all variables
         var OriginalServings
         var Sause
         var Beef
         var Lemon
         var Onion
         var Tomatoe
         var Shells
         var WantedServings

         // get input values
         OriginalServings = getInputAsNumber("OriginalServingsBox")
         Sause = getInputAsNumber("SauseBox")
         Beef = getInputAsNumber("BeefBox")
         Lemon = getInputAsNumber("LemonBox")
         Onion = getInputAsNumber("OnionBox")
         Tomatoe = getInputAsNumber("TomatoeBox")
         Shells = getInputAsNumber("ShellsBox")
         WantedServings = getInputAsNumber("WantedServingsBox")

         // perform conversions
         Sause = Sause / OriginalServings * WantedServings
         Beef = Beef / OriginalServings * WantedServings
         Lemon = Lemon / OriginalServings * WantedServings
         Onion = Onion / OriginalServings * WantedServings
         Tomatoe = Tomatoe / OriginalServings * WantedServings
         Shells = Shells / OriginalServings * WantedServings

         // write output value
         setOutput ("OriginalServingsBox", WantedServings)
         setOutput ("SauseBox", Sause)
         setOutput ("BeefBox", Beef)
         setOutput ("LemonBox", Lemon)
         setOutput ("OnionBox", Onion)
         setOutput ("TomatoeBox", Tomatoe)
         setOutput ("ShellsBox", Shells)
        }
    </script>

</head>

<body>
    Instructions:<br>
    Here is a recipe for tasty pasta<br>
    <br>
    To change the recipe for a different number of servings<br>
    Type the amount of each ingredient.<br>
    Type the number of servings that you want to make.
    click the go button.<br>
    Converted amounts will appear where the original amounts were typed.<br>
    <br>
    <br>
    Input values And Output Values:<br>
    For this many servings: <input id="OriginalServingsBox"><br>

    Pasta Sause, in fluid ounces: <input id="SauseBox"><br>

    Precooked Ground beef, in ounces: <input id="BeefBox"><br>

    Freshly squeezed lemons, in quantity: <input id="LemonBox"><br>

    Onions, in quantity: <input id="OnionBox"><br>

    Tomatoes, in quantity: <input id="TomatoeBox"><br>

    Pasta Shells in ounces <input id="ShellsBox"><br>

    I want to make this many servings: <input id="WantedServingsBox"><br>
    <input type="submit" value="go" onclick="calculate()"><br>

</body>
</html>

```