怎么在点击确定按钮后退出 input 编辑状态，并且按钮恢复到修改按钮

<div class="row cl">
<label class="form-label col-3">测试:</label>
<div class="formControls col-6">
<label><span id="OrderTime">待修改文字</span></label>
</div>
<input id="changeOrderTime" type="button" value="修改" onclick="changeOrderTime()"/>
<button style="display:none" id="timeChangeOK">确定</button>
<script type="text/javascript">
function changeOrderTime(){
document.getElementById('timeChangeOK').style.display='block';
document.getElementById('changeOrderTime').style.display='none';
var o = document.getElementById("OrderTime");
var c = o.innerHTML;
o.innerHTML = "<input type='text' value='" + c + "'/>"
}
</script>
</div>

现在这段代码是可以在点击修改后 按钮变为确定，并且input输入框会出现