Toggle class on trigger and on div inside trigger

I'm trying to create an own multiselect dropdown with checkboxes. Works so fine, so far, the only problem that i have is, that the class .checkbox-selected wich triggers the design of the checkbox rectangle, is only triggert when i click on the checkbox, but not on the text wich is right to it, or the link in generell. How can i achieved it, that the trigger is also set by clicking the link or text?

$(document).ready(function(e) {
  $(".dropdown-items .checkbox").click(function() {
    $(this).toggleClass("checkbox-selected");
  });
});

.dropdown-items {
  font-size: .875rem;
  line-height: 1.375em;
  margin-bottom: 0.625rem;
  display: flex;
  align-items: center;
}

.checkbox {
  width: 18px;
  height: 18px;
  border: 1px solid #E2E2E2;
  border-radius: 5px;
  margin-right: 0.625rem;
}

.checkbox-selected {
  background-color: #BC9590;
  width: 18px;
  height: 18px;
  border-color: #bc9590;
  background-image: url(../img/checked.svg);
  background-repeat: no-repeat;
  background-position: center center;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<a href="#" class="dropdown-items">
  <div class="checkbox"></div>
  <p>demo</p>
</a>
<a href="#" class="dropdown-items">
  <div class="checkbox"></div>
  <p>demo</p>
</a>