How do I get my code to calculate a value from javascript and display the answer in html?

I am trying to create a code that calculates the ddf (daily water flow) from a household based on the type of household, number of bedrooms, number of occupants, and floor area. Right now I have completed code for a single family with any number of bedrooms and occupants (no code for floor area yet and other types of homes). But it is not showing the answer or calculating it. P.S. the if statements are based on guidelines for calculating water flow based on the info. Any help would be greatly appreciated.

<input type="number" id="bedrooms" placeholder="Number of Bedrooms" />
<input type="number" id="occupants" placeholder="Number of Occupants" />
<input type="number" id="area" placeholder="Floor Area (m&sup2)"/>


<select name="type of residence" id="residence">
  <option value=""disabled selected>Select the Type of Residence</option>
  <option value="single">Single Family Dwelling</option>
  <option value="multi">Multi Family</option>
  <option value="luxury">Luxury Home</option>
  <option value="cottage">Seasonal Cottage</option>
  <option value="mobile">Mobile Home</option>
</select>

<button onclick="calcDDF()">Calculate DDF</button>

<script>
function calcDDF() {
var ddf=0;
let bedrooms=document.getElementsById("bedrooms").innerHTML;
let occupants=document.getElementsById("occupants").innerHTML;
let residence=document.getElementsById("residence").innerHTML;

if (residence = single) {

  if (bedrooms == 1 && occupants == 2 || occupants == null) {
    ddf=700;
  }
  if (bedrooms == 1 && occupants > 2) {
    ddf=occupants*350;
  }
  if (bedrooms == 2 && occupants == 3 || occupants == null) {
    ddf=1000;
  }
  if (bedrooms == 2 && occupants > 3) {
    ddf=occupants*350;
  }
  if (bedrooms == 3 && occupants == 3.75 || occupants == null) {
    ddf=1300;
  }
  if (bedrooms == 3 && occupants > 3.75) {
    ddf=occupants*350;
  }
  if (bedrooms == 4 && occupantss == bedrooms + 0.5 || occupants == null) {
    ddf=1600+((bedrooms-4)*300);
  }
  if (bedrooms => 4 && occupants > bedrooms + 0.5) {
    ddf=occupants*350;
  }
}
  document.getElementById("ddf").innerHTML = ddf;
}
</script>