在对表单进行求值后选中复选框时，如何保持显示的div？

Question

我有一个注册表单，其中的字段是动态显示的（在选中复选框后）。并且一切正常，但在提交并重新加载页面之后，div就有了CSS display:block。 如果用户取消选中复选框，即使重新加载页面，如何保留显示的div？

以下是示例：

    $("input#checkbox_other_certifications-0").click(function() {
        if($('input#checkbox_other_certifications-0').is(':checked'))
        $(".xde-element-input-text.xde-element-name-other_certifications").show();  // checked
    else
        $(".xde-element-input-text.xde-element-name-other_certifications").hide();  // unchecked
    });

.xde-element-input-text.xde-element-name-other_certifications{
  display:none;
  background: #ccc;
  padding: 10px;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>
<label for="checkbox_other_certifications-0"><input type="checkbox" value="Inne" name="checkbox_other_certifications[]" id="checkbox_other_certifications-0"><span class="xde-input-description">Others</span></label>

<div class="xde-element-input-text xde-element-name-other_certifications">
<label class="wpjb-label">Other - what?</label>
<div class="wpjb-field">
<input id="other_certifications" name="other_certifications" type="text">            </div></div>

DEMO

谢谢你，问候。