Javascript checkbox check if all other checkbox are checked working but want something more

<script>$(function(){
  $('#admin_permission_check').on('change',function(){
     $('.admin_permission_check').prop('checked',$(this).prop('checked'));
  });
  $('.admin_permission_check').on('change',function(){
     $('#admin_permission_check').prop('checked',$('.admin_permission_check:checked').length ? true: false);
  });

});</script>
<input type=checkbox id='admin_permission_check' value="1" /> Select All
<input type=checkbox class='admin_permission_check' value="2" />
<input type=checkbox class='admin_permission_check' value="2" />

This is working fine and i am able to check all check boxes with class admin_permission_check when checkbox with id admin_permission_check is being checked.

But when i have unchecked any checkbox with class admin_permission_check then the checkbox with id admin_permission_check is not being unchecked automatically and what should i do to if all the checkboxes with class admin_permission_check are checked already on pageload then the checkbox with id admin_permission_check automatically gets checked.

I don't know about Javascript but searching helped me to achieve the code above which is working but not as expected.