JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="https://gitcdn.github.io/bootstrap-toggle/2.2.2/css/bootstrap-toggle.min.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
  <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>	

<script src="https://gitcdn.github.io/bootstrap-toggle/2.2.2/js/bootstrap-toggle.min.js"></script>


<ul class="list-group1">
          <li class="list-group-item1"><input type="checkbox" data-toggle="toggle" /><span class="list-group-item1-text">One</span>
          <li class="list-group-item1"><input type="checkbox" /><span class="list-group-item1-text">Two</span></li>
          <li class="list-group-item1"><input type="checkbox" /><span class="list-group-item1-text">Three</span></li>
          <li class="list-group-item1"><input type="checkbox" /><span class="list-group-item1-text">Four</span></li>
          <li class="list-group-item1"><input type="checkbox" /><span class="list-group-item1-text">Five</span></li>
        </ul>

CSS

.list-group-item1-text{margin-left:15px;}

JavaScript

$('ul.list-group1 li').click( function() {
    var $cb = $(this).find(":checkbox");
    if (!$cb.prop("checked")) {
        $cb.prop("checked", true);
    } else {
        $cb.prop("checked", false);
    }
     });

	 $('ul.list-group1 li input').click(
    function(event){
        event.stopPropagation();
    });