JSFiddle - React, Tailwind, and code Playground

HTML

<select id="time_from">
<option value="">select one</option>
<option value=1> 1</option>
<option value=2> 2</option>
<option value=3> 3</option>
<option value=4> 4</option>
<option value=5> 5</option>
</select>

<select id="time_to">
<option value="" >select one</option>
<option value=1> 1</option>
<option value=2> 2</option>
<option value=3> 3</option>
<option value=4> 4</option>
<option value=5> 5</option>
</select>

<div id=hour_total></div>

JavaScript

let time_from = $('#time_from');
let time_to   = $('#time_to');
let hour_total= $('#hour_total');

time_from.change( function(  ) {
  duration_time = time_from.val() + time_to.val();
  hour_total.text(duration_time + 'hour');
});

time_to.change( function(  ) {
  duration_time = time_from.val() + time_to.val();
  hour_total.text(duration_time + 'hour');
});