YouTube checkbox

HTML

<span class="checkbox-on-off ">
<input id="autoplay-checkbox" class="" type="checkbox" checked="">
    <label for="autoplay-checkbox" id="autoplay-checkbox-label">
      <span class="checked">&nbsp;</span>
      <span class="unchecked"></span>
      <span class="toggle">&nbsp;</span>
    </label>
  </span>

CSS

/* this sets the actual size of the label */
.checkbox-on-off {
  position: relative;
  display: inline-block;
  width: 35px;
  padding-right: 2px;
  overflow: hidden;
  vertical-align: middle;
}

/* this positions the check box label over the text box */
.checkbox-on-off input[type=checkbox] {
  position: absolute;
  opacity: 0;
}

/* makes the background blue */
.checkbox-on-off input[type=checkbox]:checked+label {
  background-color: #167ac6;
}
/* this is the grey background check mark */
.checkbox-on-off label {
  display: inline-block;
  border: 1px solid transparent;
  height: 13px;
  width: 100%;
  background: #b8b8b8;
  cursor: pointer;
  border-radius: 20px;
}

/* this adds the check mark */
.checkbox-on-off input[type=checkbox]:checked+label .checked {
  display: inline-block;
  margin-top: 3px;
  margin-left: 6px;
  background: no-repeat url(//s.ytimg.com/yts/imgbin/www-hitchhiker-vflAhaHWR.webp) -421px -77px;
  background-size: auto;
  width: 10px;
  height: 7px;
}

/* if you click the checkbox, it sometimes has a grey square */
.checkbox-on-off label .checked {
  display: none;
}

.checkbox-on-off input[type=checkbox]:checked+label .unchecked {
  display: none;
}
.checkbox-on-off label .unchecked {
  display: inline-block;
  float: right;
  padding-right: 3px;
}

/* this positions the white dot */
.checkbox-on-off input[type=checkbox]:checked+label .toggle {
  float: right;
}

/* this is the actual white dot */
.checkbox-on-off label .toggle {
  float: left;
  background: #fbfbfb;
  height: 13px;
  width: 13px;
  border-radius: 20px;
}

JavaScript

$("#autoplay-checkbox").on("click", function(){
  if ($("#autoplay-checkbox").prop("checked")){
 		console.log($("#autoplay-checkbox"));
  }
});