jquery runtime controls(portlets)
<pre><code>function ParseAchievementsXML(xml) {
$(xml).find('Achievement').each(function () {
    var child = document.createElement("div");
    child.setAttribute("class", "portlet ui-widget ui-widget-content ui-helper-clearfix ui-corner-all");

    var header = document.createElement("div");
    header.setAttribute("class", "portlet-header ui-widget-header ui-corner-all");

    var toggler = document.createElement("span");
    toggler.setAttribute("class", "ui-icon ui-icon-minusthick");

    var content = document.createElement("div");
    content.setAttribute("class", "portlet-content");

    $(".portlet-header .ui-icon").click(function () {
        $(this).toggleClass("ui-icon-minusthick").toggleClass("ui-icon-plusthick");
        $(this).parents(".portlet:first").find(".portlet-content").toggle();
    });

    var title = $(this).find('Title').text();
    var description = "&lt;b&gt;Description: &lt;/b&gt;" + $(this).find('Description').text() + "&lt;p /&gt;";
    var role = "&lt;b&gt;Role: &lt;/b&gt;" + $(this).find('Role').text() + "&lt;p /&gt;";
    var reward = "&lt;b&gt;Reward: &lt;/b&gt;" + $(this).find('Reward').text() + "&lt;p /&gt;";
    var date = "&lt;b&gt;Date: &lt;/b&gt;" + $(this).find('Date').text() + "&lt;p /&gt;";




    $(header).html(title);
    $(header).prepend(toggler);
    $(content).append(description);
    $(content).append(role);
    $(content).append(reward);
    $(content).append(date);

    $(child).append(header);
    $(child).append(content);


    $("#achievements").append(child);

});
</code></pre>

<p>}</p>

<p>I use the above function to iterate through an xml and create portlets (at runtime) for each of the elements in the file. The trouble I am having is that the toggle button  on the portlets only seems to work for every other element (1st,3rd,5th,..  or 2nd,4thm...)</p>
