Attach ui-widget to dynamic element

When dynamically creating a div using an .ajax() function. I'm unable to attach the .tabs() widget to the newly created .

This link creates the new div and pulls the #tabs div from "somefile.php"

<a href="newdiv">Creates New Div</a>

Here is the dynamically created div:

    <div id="newdiv">
      <div id="tabs">
           <ul>
                 <li>Example One</li>
                 <li>Example Two</li>
          </ul>
      </div>
</div>

Here is the script I'm using. Output - Error: (d || "").split is not a function Copy code

$( "#tabs" ).live(function(){
    $(this).tabs()
});

I'm able to show the tabs when adding an event parameter, However I want the tabs to display without an event. Copy code

$( "#tabs" ).live("click", function(){
    $(this).tabs()
});

开发者_C百科

Someone please help me understand what I'm missing. I've been stuck on this for 3 days.

Chris

---

Are you trying to assign the live handler before the AJAX callback has completed?
My suspicion is you need to move your code into the success handler of your AJAX object and not use live because I don't think it does what you think.
If you post more of your code we'll be able to help you out a bit more.

My guess as to what you're trying to do:

 $.ajax({
  type: "GET",
  url: "/tabs/",
  async: true,
  success: function() {
    $('#tabs').tabs()
  } 
});

---

RSG is correct in that you're using the live function incorrectly. The live function is specifically for attaching event handlers to elements and calling functions. As RSG pointed out, in your case the best thing to do is call the tabs widget in the success function of the ajax request.