jQuery - .on() troubles with "click"
<p>I'm trying to create an event for my jQuery/PHP to load more content on scroll down. But I've run into some troubles about my .on() event.</p>

<p>I've created a function (which is the following code you see, I just removed the function functioname{}), which is called when the bottom of the page is reached.</p>

<p>My problem is that with .on() you have to add a "click" property, which is kinda hard for me, because it has to load <em>without</em> the click. Is there a property that makes it run the .on() when I've called the function?</p>

<pre><code>$("#container").on("click", ".box", function(event){
    alert("hej");

 $.post("site/scroll.php?mabid=" + $mabid,
  function(data){
    if (data != "") {
    alert($(".box:last").attr("mabid"));
    $(".box:last").after(data); 
  }
 });
});
</code></pre>

<p>The reason I'm using .on() is because it has to add a jQuery plugin to the new created elements, which is <em>.box</em>, which makes it have the right layout. The plugin I'm trying to bind to the new created dom elements is this: <a href="http://www.wookmark.com/jquery-plugin" rel="nofollow">http://www.wookmark.com/jquery-plugin</a> </p>

<p><strong>UPDATE</strong></p>

<p>I don't have troubles loading the content. I have troubles adding the jQuery plugin Wookmark to the NEW DOM elements. Which means that it's messy and looks very very bad.</p>

<p>Please read the small description of WookMark plugin on their website. It's a plugin that makes <em>.box</em> act like on pinterest.com or wookmark.com where they fit-into eachother. </p>

<p>Right now the new DOM elements just inserts and looks messy, WITHOUT the plugin activated.</p>

<p><strong>UPDATE2</strong> </p>

<p>After some communication and misunderstandings the problem is solved by just adding the Wookmark plugin to the new elements in the $.post(); like:</p>

<pre><code>$.post("scroll.php?...", function(data){

  if(data != ""){
   //add the new dom elements, with .after(), .append() or something else.
   //add the needed effects to the new dom elements. For example with wookmark:
   $('.box').wookmark(//wanted effects); where .box is the dom elements I've created.
  }

});
</code></pre>

<p>Thanks for the help to everyone, especially FelixKling and Oscar!</p>
