JSFiddle - React, Tailwind, and code Playground

by vural kaya

HTML

<script type="text/javascript" src="http://code.jquery.com/jquery-1.11.1.min.js"></script>
<input type="checkbox" name="1"/> Php Dersleri <br/>
<input type="checkbox" name="2"/> Css Dersleri <br/>
<input type="checkbox" name="3"/> jQuery Dersleri <br/>
<input type="checkbox" name="4"/> cURL Dersleri <br/>

<br/>
<span id="sec">Hepsini Seç</span>
<span id="birak">Seçimi Temizle</span>

CSS

span{
    margin-left:10px; 
	cursor:pointer;
	border:1px solid #ddd;
	padding: 5px 5px 5px 5px;
	background:#999;
	color:#fff;
	}
span:hover{
	background:#333
	}
input{
	margin-left:10px;
	}

JavaScript

$(document).ready(function(){
	
		$("#sec").click(function(){
			$("input:checkbox").each(function(){
			
				this.checked = true;
			
			});
		});
		
		$("#birak").click(function(){
			$("input:checkbox").each(function(){
			
				this.checked = false;
			
			});
		});
		
	
	
	});