javascript d块在bootsrap 4中不起作用

Question

我们有很多radio input。

$("#marketer").click(function() {
  $('#referral_code').toggleClass('d-block');
});

<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" rel="stylesheet"/>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="form-group row d-none" id="referral_code">
  <label for="referral_code">Referral Code</label>
  <div class="col-md-10">
    <input id="referral_code" type="text" class="form-control" name="referral_code">
  </div>
</div>
<input type="radio" name="familiar" id="google" value="1">
<input type="radio" name="familiar" id="friends" value="2">
<input type="radio" name="familiar" id="advertising" value="3">
<input type="radio" name="familiar" id="marketer" value="4">

当我单击#marketer时，应该显示#referral_code。