Edit in JSFiddle

(() => {

	const form = document.querySelector('form[name=bmi]');
  
  const getHealthMessage = unit => {
    let healthMessage;
  	if (unit < 18.5) {
      healthMessage = 'considered underweight';
    } else if (unit > 18.5 && unit < 25) {
      healthMessage = 'a healthy weight';
    } else if (unit > 25) {
      healthMessage = 'considered overweight';
    }
    return healthMessage;
  };
  
  const getBMI = (weight, height) => {
  	let newWeight = parseInt(weight, 10);
  	let newHeight = parseInt(height, 10);
    return (newWeight / (newHeight /100 * newHeight / 100)).toFixed(1);
  };
  
  const onSubmit = event => {
  	
    event.preventDefault();
    
    const result = form.querySelector('.result');
    const health = form.querySelector('.health');
    
    const weight = form.querySelector('input[name=weight]').value;
    const height = form.querySelector('input[name=height]').value;
    
    const bmi = getBMI(weight, height);
    
    result.innerHTML = bmi;
    health.innerHTML = getHealthMessage(bmi);
    
  };
  
  form.addEventListener('submit', onSubmit, false);
	
})();
<form name="bmi">
  <h1>BMI Calculator</h1>
  <label>
    <input type="text" name="weight" placeholder="Weight (kg)">
  </label>
  <label>
    <input type="text" name="height" placeholder="Height (cm)">
  </label>
  <button type="submit">
    Calculate BMI
  </button>
  <div class="calculation">
    <div>
      BMI calculation: <span class="result"></span>
    </div>
    <div>
      This means you are: <span class="health"></span>
    </div>
  </div>
</form>