Plotting multiple charts using PyScript - Overlapping

I am trying to plot multiple charts using multiple outputs. When the page is rendered, the second chart is using the data from the first. How do I get around this?

Plot 1 (Working as intended)

Plot 2 (With overlapping charts)

Code:

        <div id="table-section" class="container-fluid"></div>
        <div id="piechart" class="container-fluid gx-3"></div>
        <div id="columngraph" class="container-fluid gx-3"></div>
        <py-script>
            import pandas as pd
            import numpy as np
            import matplotlib.pyplot as plt
            import seaborn as sns
            from pyodide.http import open_url

            url = open_url('../data/salaries.csv')

            df = pd.read_csv(url)
            table = df.head().to_html(classes="table")
            Element('table-section').element.innerHTML = table
        </py-script>
        <py-script output="piechart">
            min, max = df.salary_in_usd.quantile([0.15,0.985])

            df_no_outliers=df[(df.salary_in_usd>min) & (df.salary_in_usd&lt;max)]

            top_jobs=df_no_outliers.job_title.value_counts()[:7]

            n=df_no_outliers.shape[0]
            job_distribution=top_jobs*100/n
            job_distribution.plot(kind='pie',autopct='%1.0f%%', figsize=(15,8))
            plt.title('Job Distribution among top 10 in demand job title')

            plt
        </py-script>
        <py-script output="columngraph">
            (sns.barplot(x='work_year', y='salary_in_usd', data=df_no_outliers))

            plt
        </py-script>