在PHP中包含模板时删除旧内容

<?php include "main.php" #this file is supposed to be included after an event occurred ?>

 <!-- this should be deleted after include, also styles scripts and everything in this old-content id-->
         <div id="old-content">
         <link rel="stylesheet" href="custom.css">
    some content
        </div>

What i tried, i add the below in the old-content div, but jquery is included only in the template main.php

$("#old-content").empty();

Problem with this, is that files are not actually removed and when i view page source i can see the old content at the end

You can use .remove() method it takes elements out of the DOM. Use it when you want to remove the element itself, as well as everything inside it.

$("#old-content").remove();

// find elements
var button = $("button")

// handle click and add class
button.on("click", function(){
  $("#banner-message").remove();
})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="banner-message">
  <p>Hello World</p>
  <button>Remove</button>
</div>

</div>

Try remove()

$("#old-content").remove();

here's how I'd do it:

<?php if (file_exists('main.php')) : ?>
    <?php include 'main.php'; ?>

    <script>
        jQuery(document).ready(function($)
        {
            $('#old-content').remove()
        })
    </script>
<?php endif; ?>

the good thing about this is, if the file doesn't exist, then the soft include warning gets picked up and the code isn't run, whereas just having the code outside a conditional will always run the function and remove the content, even if it isn't included successfully

I think there is conflicting between jquery. So use javascript code like this.

var x = document.getElementById("old-content"); 

x.remove(x.selectedIndex);