Onclick Javascript Function

Not working onclick function

HTML

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<div id="toggle">
			<img src="http://www.animated-gifs.eu/avatars-100x100-cartoons-spongebob/0038.gif" alt="robot image" class="robot rotate" width="100px" height="100px" />
		</div>

CSS

.rotate{
    -webkit-transition-duration: 0.8s;
    -moz-transition-duration: 0.8s;
    -o-transition-duration: 0.8s;
    transition-duration: 0.8s;
     
    -webkit-transition-property: -webkit-transform;
    -moz-transition-property: -moz-transform;
    -o-transition-property: -o-transform;
    transition-property: transform;
     
    overflow:hidden;


 
}  
 
.rotate:hover {
    -webkit-transform:rotate(-90deg);
    -moz-transform:rotate(-90deg);
    -o-transform:rotate(-90deg);
}

JavaScript

$(document).ready(function () {
				$('img.rotate').hover(function () {
					$('img.rotate').addClass('onclick');
				}, function () {
					$('img.rotate').removeClass('onclick');
				});
			});