I'm extremely new to jquery and trying to write a toggle function without using the built-in functionality. From what I've read, this should be a fairly straightforward exercise. However, I'm running an issue. My code doesn't seem to do anything. Not clear to me why because nothing is erroring out? Here's what I've got:
<html>
<head>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
// we will add our javascript code here
$(document).ready(function() {
var vis = $('#fx_div').visible;
if(vis) {
$('#click_div').click(function() {
$('#fx_div').fadeOut('slow', function() {});
});
}
else {
$('#click_div').click(function() {
$('#fx_div').fadeIn('slow', function() {});
});
}
});
</script>
</head>
<body>
<div id="click_div">
Click here
</div>
<br></br><br></br>
<a href="" id="fx_div">Hey what's up. This will fade in and out.</a>
</body>
</html>