<link href="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js"></script> <script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> <!------ Include the above in your HEAD tag ----------> <div class="container"> <div class='col'> <div class='card'> <div class='card-header font-weight-bold'>Filters:</div> <div class='card-body row' id='filterCard'> <div class='col'> <p>Status Filters:</p> <div class='form-check form-check-inline'> <input class='form-check-input samsStatusCheck' type='checkbox' id='openCheck' value='Open' checked> <label class='form-check-input' for='compCheck'>Open</label> </div> <div class='form-check form-check-inline'> <input class='form-check-input samsStatusCheck' type='checkbox' id='compCheck' value='Completed'> <label class='form-check-input' for='compCheck'>Completed</label> </div> </div> <div class='col'> <p>Due Date Filters:</p> <div class='form-check form-check-inline'> <input class='form-check-input samsDueCheck' type='radio' id='allCheck' name='radDue' value='All' checked> <label class='form-check-input' for='allCheck'>All Actions</label> </div> <div class='form-check form-check-inline'> <input class='form-check-input samsDueCheck' type='radio' id='30Check' name='radDue' value='30'> <label class='form-check-input' for='30Check'>30</label> </div> <div class='form-check form-check-inline'> <input class='form-check-input samsDueCheck' type='radio' id='60Check' name='radDue' value='60'> <label class='form-check-input' for='60Check'>60</label> </div> <div class='form-check form-check-inline'> <input class='form-check-input samsDueCheck' type='radio' id='90Check' name='radDue' value='90'> <label class='form-check-input' for='90Check'>90</label> </div> </div> <div class='col'> <button type='button' class='btn-primary btn-sm btn resetFilters'>Reset Filters</button> </div> </div> </div> </div> </div>