Search code examples
jqueryloadgetscript

jQuery load() div that contains a script


I'm trying to load a div that contains a javascript link into another div on another page (http://www.thebigkerbang.com/brand-storytellers/clients/xour-clients.html) with load(). I know load() strips out the script tag but I'm getting a bit confused with the $.getscript. I can load the div fine as I can see it in the code inspector.

loading the div from this page:

 <div id="beautific_hype_container" style="position:relative;overflow:hidden;width:700px;height:500px;"> 
    <script type="text/javascript" charset="utf-8" src="beautific.hyperesources/beautific_hype_generated_script.js?10913"></script> 
  </div>

into the div from this page:

<div class = "edgeContent"></div>

with:

 $('document').ready(function(){
  $(".beautific").click(function(){
    $(".edgeContent").load('beautific/beautific.html #beautific_hype_container', function() {   
    $.getScript('beautific/beautific.hyperesources/beautific_hype_generated_script.js?10913');
        });
      });
    });

Solution

  • I would do it with an $.ajax() call:

    $('document').ready(function(){
      $(".beautific").click(function(){
        $.ajax({
          url: "beautific/beautific.html #beautific_hype_container",
        }).done(function ( data ) {
          $(".edgeContent").html(data);
        });
      });
    });
    

    That way your script tag will also not be filtered out.