index.html

<!DOCTYPE html>
<html>

<head>
  <meta charset="UTF-8">
  <title>Title of the document</title>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
  <script src="script.js"></script>
  <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
</head>

<body>
  <div class="container col-sm-8">
    <form>
      <div class="form-group">
        <label for="exampleInputEmail1">Source</label>
        <input type="text" class="form-control" id="sourceInput" aria-describedby="emailHelp" placeholder="ex.. Colombo">
      </div>
  
      <div class="form-group">
        <label for="exampleInputPassword1">Destination</label>
        <input type="text" class="form-control" id="destInput" placeholder="ex.. Jaffna">
      </div>
  
      <button id="submitBtn" type="button" class="btn btn-primary" onclick="onSubmit()">Submit</button>
    </form>
  
    <div class="routes">

      <h2 id="data-display-header"></h2>

      <span class="row" id="data-display"></span>
  
    </div>
  </div>
</body>

</html>