ต้องการให้แสดงข้อมูลในส่วนที่ click jquery ต้องเขียยังไงครับ (มีรูปด้านในครับ)

<script>
$(document).ready(function(){
    $("#hide").click(function(){
        $("p").hide(1000);
    });
    $("#show").click(function(){
        $("p").show(1000);
    });
});
</script>

<script>
$(document).ready(function(){
    $("button").click(function(){
        $("p").toggle();
    });
});
</script>

<style>
	.nums{
		text-align:center;
		width:200px;
		border: 1px solid gray;
		margin-bottom: 5px;
	}
	.detail{
		display:none;
		width:200px;
		border: 1px solid gray;
		margin-bottom: 5px;
		background-color: green;
	}
</style>
<?php
	$num = 5;
	for($i=0; $i<$num;$i++){
		?>
			<div class="nums" rel="0">
				<p>No. <?php echo $i;?></p>
				<span class="detail">show</span>
			</div>
		<?php		
	}
?>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script>
	$(document).ready(function(){
            $('div').on('click',function(){
                $('div').each(function(){
                    $(this).find('span').hide();
                });
                var rel=$(this).attr('rel');
                if(rel==0){
                    $(this).find('span').show();
                    $(this).attr('rel','1');
                }else{
                    $(this).find('span').hide();
                    $(this).attr('rel','0');
                }
                
            });
        });
</script>