Как исправить, чтобы кнопка не нажимала на чекбокс

function templateButton() {
  return `<button type="submit" class="form__submit-popup button">применить</button>`;
}

const checkbox = $('.checkbox');
checkbox.on('click','.form__submit-popup button', function(e) {
//отправить данные
});
checkbox.on('click','input,span', function() {
  checkbox.find('.form__submit-popup').remove();
  $(this).parent().append(templateButton);
});

.checkbox {
  cursor: pointer;
  display: block;
  position: relative;
  margin-top: 5px;
}

.checkbox__input {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  border: 0;
  padding: 0;
  clip: rect(0 0 0 0);
  overflow: hidden;
  appearance: none;
}

.checkbox__text {
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  user-select: none;
  font-weight: normal;
  font-size: 16px;
  line-height: 20px;
}
.checkbox__text::before {
  content: "";
  margin-right: 0.7em;
  display: inline-block;
  width: 18px;
  height: 18px;
  flex-shrink: 0;
  flex-grow: 0;
  border: 1px solid #6acdf8;
  border-radius: 3px;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: 50% 50%;
  transition: all 0.3s;
}
.checkbox__text:hover::before {
  border: 1px solid #6acdf8;
}

/* checkbox clicked */
.checkbox__input:checked + .checkbox__text::before {
  content: "";
  border: 1px solid #00A1E6;
  background-image: url("data:image/svg+xml,%3Csvg fill='none' viewBox='0 0 9 7' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m8.7863 0.4795-0.25981-0.26259c-0.28523-0.28922-0.75253-0.28922-1.0387 0l-4.4111 4.4641-1.5652-1.5832c-0.28522-0.28891-0.75283-0.28891-1.038 3.1e-4l-0.25951 0.26228c-0.28522 0.28892-0.28522 0.76176 0 1.0507l2.3423 2.3725c0.28552 0.2886 0.75283 0.2886 1.0384 0l5.1918-5.2534c0.28492-0.28891 0.28492-0.76176 0-1.0507z' fill='%2300A1E6'/%3E%3C/svg%3E");
}

/* checkbox checked & focus */
.checkbox__input:focus + .checkbox__text::before {
  box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
}

/* checkbox disabled */
.checkbox__input:disabled + .checkbox__text::before {
  background-color: #e9ecef;
  border: none;
}

.form__submit-popup {
  cursor: pointer;
  height: 38px;
  padding: 0 16px;
  background: #fff;
  border: 1px solid #E8EFF4;
  box-shadow: 0 3px 8px rgba(73, 90, 102, 0.07);
  border-radius: 6px;
  line-height: 35px;
  color: #00A1E6;
  position: absolute;
  left: 120px;
  top: 40%;
  transform: translateY(-50%);
  z-index: 1;
}
.form__submit-popup::before {
  content: "";
  display: block;
  position: absolute;
  width: 12px;
  height: 12px;
  top: 12px;
  left: -7px;
  background: #fff;
  border-bottom: 1px solid #E8EFF4;
  border-left: 1px solid #E8EFF4;
  transform: rotate(45deg);
  transition: all 0.3s;
}
.form__submit-popup:hover::before {
  background: #f8f8f8;
  border-bottom: 1px solid #f8f8f8;
  border-left: 1px solid #f8f8f8;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<label class="checkbox">
  <input type="checkbox" class="checkbox__input">
  <span class="checkbox__text">Фильтр 1</span>
</label>
<label class="checkbox">
  <input type="checkbox" class="checkbox__input">
  <span class="checkbox__text">Фильтр 2</span>
</label>
<label class="checkbox">
  <input type="checkbox" class="checkbox__input">
  <span class="checkbox__text">Фильтр 3</span>
</label>
<label class="checkbox">
  <input type="checkbox" class="checkbox__input">
  <span class="checkbox__text">Фильтр 4</span>
</label>
<label class="checkbox">
  <input type="checkbox" class="checkbox__input">
  <span class="checkbox__text">Фильтр 5</span>
</label>