JSFiddle - React, Tailwind, and code Playground

HTML

<div class="form-group">
  <label class="col-md-4 control-label">Section:</label>
  <div class="col-md-8">
    <select id="middle" class="form-control">
      <option>1</option>
      <option>2</option>
      <option>3</option>
      <option>4</option>
      <option>5</option>
      <option>6</option>
      <option>7</option>
      <option>8</option>
      <option>9</option>
      <option>10</option>
    </select>
  </div>
</div>

<br /><br />

<div class="form-group">
  <label class="col-md-4 control-label" id="output"></label>
  <div class="col-md-8">
    <select id="bottom" class="form-control">
      <option>11</option>
      <option>12</option>
      <option>13</option>
    </select>
  </div>
</div>

JavaScript

$('#middle').change(function() {
  $('#output').text($(this).find(":selected") ? $(this).find(":selected").text() : $(this).find(":first").text());
}).change();