I am trying to learn Javascript (I'm a PHP developer) and I've written a simple script that I believe is most of the way to what I need.

Its very basic, I have 3 option inputs, first is quantity then 2 add-ons which both default to 0. Then a subtotal would populate beneath based on user input. Default is first option of quantity (25 in this case).

I defined arrays for the 3 option inputs, then assigned a variable to each one via getElementbyID ... then I would simply add them together and here I know my syntax is off. (It's the syntax of JS that I haven't been able to get my head around)

If someone can give me a quick logic guideline as to how and WHY ... that's what I'm looking for. Thx.

My code is below:


HTML Code:
 <script>
 var card_qty = new Array();
 card_qty["25"]=65.00;
 card_qty["50"]=120.00;
 card_qty["75"]=150.00;
 
  var return_address_qty = new Array();
 return_address_qty["0"]=0.00;
 return_address_qty["25"]=12.00;
 return_address_qty["50"]=20.00;
 return_address_qty["75"]=30.00;
 
 var liners_qty = new Array();
 liners_qty["0"]=0.00;
 liners_qty["25"]=12.00;
 liners_qty["50"]=20.00;
 liners_qty["75"]=30.00;
 
 var qty = document.getElementById('card_qty')
 var ret_add = document.getElementById('return_qty')
 var liners = document.getElementById('liners_qty')
 
 function calculatesubtotal() {}
 var subtotal = qty + ret_add + liners; // this is clearly wrong!!
 
    var amount = document.getElementById('subtotal');
    amount.style.display='block';
    amount.innerHTML = "Subtotal: $"  ++subtotal ++; // and how to reference the subtotal dynamcally is my other question ...

 }
 </script>
 
 <div id="price_calculator">
    <h2>PRICE CALCULATOR</h2>
    <label>Choose Qty:
   <select id="qty" name="qty">
        <option value="25">25@$65.00</option>
        <option value="50">50@$120.00</option>
        <option value="75">75@$170.00</option>
    </select></label><br>
   <label>Add return address printing:&nbsp;
   <select id="option1qty" name="option1_qty">
        <option value="0"></option>
        <option value="25">25@$12.00</option>
        <option value="50">50@$22.00</option>
        <option value="75">75@$30.00</option>
    </select></label><br>
    <label>Add assembled liners:
      <select id="option2qty" name="option2_qty">
        <option value="0"></option>
        <option value="25">25@$25.00</option>
        <option value="50">50@$50.00</option>
        <option value="75">75@$75.00</option>
    </select></label><br><br>
    <h5>Subtotal: <span id="subtotal">$101.00</span></h5>
</div>