將html存儲到變量上點擊，從DOM中刪除並將它放回另一個點擊

Question

我試圖爲視頻創建一個ON/OFF按鈕。我希望它做的事很簡單：在第一次點擊時，它會刪除視頻（而不是停止它），然後第二次將視頻放回到dom中。

我已經想出了一些代碼，但它不工作，我希望它的方式：

$('#on-off').click(function(e) { 
    e.preventDefault(); 
    if (videoContent !== ""){ 
     var videoContent = $('#video-container').html(); 
     console.log(videoContent); 
      // At this point, the console shows the variable videoContent does contain the content of #video-container. 
     $('#video-container').html(""); 
    } 
    else { 
     $('#video-container').html(videoContent); 
    } 
}); 

第一次單擊工作正常，＃視頻容器的內容存儲到videoContent。 但是，第二個不會將videoContent的內容放回到＃video-container中。實際上，它會刪除videoContent的內容。

我敢肯定，這是很簡單的解決方案，我只是無法弄清楚。 感謝

Answer 1

將在全球範圍內的變量videoContent：

var videoContent = ''; 

$('#on-off').click(function(e) { 
    e.preventDefault(); 
    if (videoContent !== ""){ 
     videoContent = $('#video-container').html(); 
     $('#video-container').html(""); 
    } 
    else { 
     $('#video-container').html(videoContent); 
    } 
});