How to run javascript functions after replacing code

How to run javascript functions after replacing code

Hi,

I need to add several times a chunk of code that's hidden after being changed.

I created some functions to hide part of the code, remove it all and sort those chunks,  combining Connect lists with tabs with Hide and Accordion.

Initailly that function was working but when i added the part to replace existing code with the chunks that i want to show, that function stop working.

The code that repalce the exixting one is this:

  1. var template = '<ul id="sortable-' + j + '" class="connectedSortable ui-helper-reset" style="height:auto;">';

    var end = '</ul>';

    $("div").find('ul#sortable-' + j).replaceWith(template + panels + end);

panels is the result of this fuinction called several times

  2. function chunk(NewData){
  3. var bar ='<nvd3-multi-bar-chart data="#6" id="#7" height="400" showXAxis="true" reduceXTicks="true" showYAxis="true" showLegend="true" showControls="true" tooltips="true"><svg></svg></nvd3-multi-bar-chart>';

  5. var pie = '<nvd3-pie-chart data="#6" id="#7" height="300" width="500" x="xFunction()" y="yFunction()" showLabels="true" pieLabelsOutside="true" showValues="true" labelType="percent" showLegend="true" tooltips="true"><svg></svg></nvd3-pie-chart>';

  7. var line = '<nvd3-line-with-focus-chart data="#6" id="#7" height="400" showLegend="true"></nvd3-line-with-focus-chart>';

  9. var table = '';

  11.         var $clonedDiv = $('#hiddenChart').clone();
  13. $clonedDiv.find("div[id='#1']").attr("id", NewData[1]);
  14. $clonedDiv.find("div[id='#2']").attr("id", NewData[2]);
  15. $clonedDiv.find("i[id='#3']").attr("id", NewData[3]);
  16. $clonedDiv.find("i[id='#4']").attr("id", NewData[4]);
  18. //verificar tipo de grafico, usar tag especifico no find
  19. if (NewData[0] == "bars") {
  20.     $clonedDiv.find('h3').replaceWith('<h3 class="panel-title">'+ NewData[5] +'</h3>');
  21. $clonedDiv.find('p').replaceWith(bar);
  22. $clonedDiv.find("nvd3-multi-bar-chart[data='#6']").attr("data", NewData[6]);
  23. $clonedDiv.find("nvd3-multi-bar-chart[id='#7']").attr("id", NewData[7]);
  24. }
  25.         else if (NewData[0] == "line") {
  26.             $clonedDiv.find('h3').replaceWith('<h3 class="panel-title">' + NewData[5] + '</h3>');
  27. $clonedDiv.find('p').replaceWith(line);
  28. $clonedDiv.find("nvd3-line-with-focus-chart[data='#6']").attr("data", NewData[6]);
  29. $clonedDiv.find("nvd3-line-with-focus-chart[id='#7']").attr("id", NewData[7]);
  30. }
  31.         else if (NewData[0] == "pie") {
  32.             $clonedDiv.find('h3').replaceWith('<h3 class="panel-title">' + NewData[5] + '</h3>');
  33. $clonedDiv.find('p').replaceWith(pie);
  34. $clonedDiv.find("nvd3-pie-chart[data='#6']").attr("data", NewData[6]);
  35. $clonedDiv.find("nvd3-pie-chart[id='#7']").attr("id", NewData[7]);
  36. }
  37. /*else{ //table
  39. }*/
  40. return $clonedDiv.html();

when i see the result it presents me the CSS that is associated to each panel but the javascript function (Sortable, Hide, Accordion and the charts) won't work.

Can anyone give some help to fix this?
Thk