I am trying to create a chart js popover but I am getting the error:

Failed to create chart: can't acquire context from the given item

I think that this is probably happening because the canvas tag is created dynamically, but I am not sure how to fix it. Any ideas? This is the js code I am using:

        $(function() {
          $('[data-toggle="popover"]').popover({
            html: true,
            content: '<canvas id="myChart" width="400" height="400"></canvas>',
          }).on('shown.bs.popover', function() {

            new Chart($('#myChart'), {
              // The type of chart we want to create
              type: 'line',

              // The data for our dataset
              data: {
                labels: ["January", "February", "March", "April", "May", "June", "July"],
                datasets: [{
                  label: "My First dataset",
                  backgroundColor: 'rgb(255, 99, 132)',
                  borderColor: 'rgb(255, 99, 132)',
                  data: [0, 10, 5, 2, 20, 30, 45],
                }]
              },

              // Configuration options go here
              options: {}
            });
          });

HTML:

<button type="button" class="btn btn-lg btn-primary" data-toggle="popover" title="Good vs. Evil Winrate" data-placement="bottom">Who's Winning?</button>