I do not think you check all work. You have to sort up the naming of the classes for the various html elements, just one example:
1. rename the individual class="disp" to say disp1, disp2, and disp3 respectively;
2. rename the class="checkindus" for environment to say class="checkindusenvironment"
<!DOCTYPE html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js">
</script>
<script>
$(document).ready(function(){
$('#checkallindus').click(function () {
var $this = $(this);
if ($this.is(':checked')) {
$('.cat1').show();
} else {
$('.cat1').hide();
}
});
$('.checkindusenvironment').click(function () {
var $this = $(this);
if ($this.is(':checked')) {
$('.disp1 .cat1').show();
} else {
$('.disp1 .cat1').hide();
}
});
});
</script>
</head>
<body>
<div class="disp1">
Case 1
<div class="cat1">Industry: Environment</div>
<div class="cat2">Product: ASP.NET</div>
<div class="des">The asp.net product in the envirnmen industry</div>
</div>
<div class="disp2">
Case 2
<div class="cat1">Industry: Hobbyist</div>
<div class="cat2">Product: WinRT</div>
<div class="des">The Winrt product in the hobbyist industry</div>
</div>
<div class="disp3">
<div class="cat1">Industry: Hobbysit</div>
<div class="cat2">Product: ASP.NET</div>
<div class="des">The ASP.NET product in the hobbyist industry</div>
</div>
<div class="head">Industry</div>
<input type="checkbox" id="checkallindus" checked>ALL
<input type="checkbox" class="checkindusenvironment" checked >Environment
<input type="checkbox" class="checkindushobbyist" checked >Hobbyist
<div class="head">Product</div>
<input type="checkbox" id="checkallpro" checked>ALL
<input type="checkbox" class="checkpro" checked>ASP.NET
<input type="checkbox" class="checkpro" checked>WinRT
</body>
</html>
The rest is your homework.