jQuery addClass example

Change class name on click in jQuery

HTML

<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css">
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.bundle.min.js"></script>
<tr>
  <td>
    <div class="dropdown">
      <button class="btn btn-secondary dropdown-toggle" type="button" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
        Select
      </button>
      <ul class="dropdown-menu" role="menu" id="options" onchange="selectFromDropDown(this.value)">
        <li><a id="weekly" selected>Option 1</a></li>
        <li><a id="biweekly">Option 2</a></li>
        <li><a id="monthly">Option 3</a></li>
      </ul>
    </div>
  </td>
  <td>
    <form data-toggle="validator" role="form" >
      <input type="submit" value="Update" class="btn btn-xs btn-block" id="update">
    </form>
  </td>
</tr>

JavaScript

$('#update').on('click', function () {
    alert($('#options').find('[selected]').html());
});

$('#options a').on('click', function () {
		$('#options a').removeAttr('selected');
    $(this).attr('selected', true);
})