使用jQuery对checkbox进行重复选择问题

1. 问题相关背景：
在网页页面中想使用checkbox实现一个选项功能（当checkbox选中时会显示更多按钮，当checkbox取消选中时会取消显示），并且能够多次重复使用。

2. 问题代码：
在看过不少博客后我选择jQuery的.prop()实现相关功能，问题代码如下：

		$("#checkBoxForWP").on('click', function changeEvent() {
            if($("#checkBoxForWP").prop('checked', true)) {
                $("#addWaypoint").css('visibility', 'visible');
                $("#waypointSeMa").css('visibility', 'visible');
                $("#waypointAdd").css('visibility', 'visible');
            } 
            else{
                $("#addWaypoint").css('visibility', 'hidden');
                $("#waypointSeMa").css('visibility', 'hidden');
                $("#waypointAdd").css('visibility', 'hidden');
            }
        });

3. 问题解析：
使用该代码存在一个问题，网页在render后checkbox起初处于“unchecked”状态，点击checkbox后也正常显示了相关需要显示的项。但当再次点击时，也无法更改回“unchecked”状态，一直处于“checked”。
4. 正确的代码：
为了解决这个问题，尝试了如下代码，将$("#checkBoxForWP").prop(‘checked’)作为判断条件。

$("#checkBoxForWP").on('click', function changeEvent() {
            if($("#checkBoxForWP").prop('checked') == true) {
                $("#addWaypoint").css('visibility', 'visible');
                $("#waypointSeMa").css('visibility', 'visible');
                $("#waypointAdd").css('visibility', 'visible');
            } 
            else{
                $("#addWaypoint").css('visibility', 'hidden');
                $("#waypointSeMa").css('visibility', 'hidden');
                $("#waypointAdd").css('visibility', 'hidden');
            }
        });