$("#img_id").clone(true).appendTo($('#clone1')).attr("id", "clone");

Вот такой код нормально работает

Теперь я пытаюсь изменить id всех элементов DOM при помощи такого алгоритма

$('#clone').children().each(function(){
      $('#clone').append(this.id+='--->');
    });

Но изменяется ID только второго элемента в клоне
Фактически в результате клонирования из такого DOM

<div id="img_id">
<div id="ne">
    <img id="main_img" src="" width="350" height="300" />
    <div id="wrapper">
            <div id="able">
        </div>
        </div>
    </div>

Получается такой

<div id="clone">
<div id="clone--->">
<div id="ne">
    <img id="main_img" src="" width="350" height="300" />
    <div id="wrapper">
            <div id="able">
        </div>
        </div>
    </div>
</div>

То есть у клона появляется новый <div id="clone">, который становится оберткой прежнего DOM

Также изменяется ID второго элемента на id="clone--->"

Но почему не изменяются все ID ?

И я предполагаю, что при восстановлении оригинала оберточный DIV с id="clone" станет лишним

mirek,
:) А тьву обязательно клонировать внутрь этих жа блоков ?

Если привязка к событиям не нужна -можно склонировать вне DOM

Вот именно, что нужна. DIV, который я клонирую фактически содержит в себе мини редактор в котором можно менять картинки и т.д.

То есть в дальнейшем необходимо полностью восстановить какое-то состояние редактора с положением всех картинок и т.д.. А главное с возможностью дальше изменять все картинки сохраненные на этапе, когда пользователь решил сохранить состояние

mirek,
А смысл в клонировании - ведь есть исходник - зачем нужна копия ?

Если нужны события кидайте ссылку на действующий код, иначе закавыряемся в неувязках, хотя сегодня всё одно не успеваю

Можно сохранить какое-то состояние и рисовать с нуля
Или потом вновь вернуться к сохраненному

Код пока на локальной машине только

А главная проблема в изменении ID всех элементов в клонированном DOM
Я думаю если изменить все ID то все бы должно заработать правильно

mirek,
Под событиями подразумевается не изменения/cостояние контента - оно сохраниться по любому, а привязка к событиям типо
onblur onchange onclick ondblclick onfocus onkeydown onkeypress onload onmousedown onmousemove

Мне надо, что-бы такие возможности jquery ui как resizable сохранились после того как DOM будет восстановлен из клона

Но пока у меня это не получается

Общая схема алгоритма вообще такая объект сохраняется в клон

А оригинал стирается для того, что-б "холст" стал пригоден для работы

Но если необходимо восстановить прежнюю работу то "холст" восстанавливается из клона

Так вот на восстановленом таким образом холсте не работают такие возможности jquery ui как resizable draggable (перетаскивание) и т.д. Другие же возможности не зависящие от jquery ui. Это навешанные мною события сохранились и работают

Но мне надо, что-бы такие возможности jquery ui как resizable draggable восстанавливались тоже

Хотя сейчас у меня все верно восстановлено с восстановлением всех оригинальных id

Смотрел исходный код до и после восстановления из клона

Получается 1 в 1

mirek,
Попробуйте так
<script type="text/javascript">
var Storage=[]
var Storage[0]=$("#img_id").clone(true).remove();
//Тут Тест восстановления из Storage[0] исходника
//....
</script>

Да я вот попробовал еще проще.

Даже если не стирать "холст", а просто восстановить его из клона на тот же самый то все возможности jquery ui - resizable draggable перестают работать

Стирать я пробовал кстати как методами remove так и detach

То есть при этом ни один из элементов описанной структуры

<div id="img_id">
<div id="ne">
    <img id="main_img" src="" width="350" height="300" />
    <div id="wrapper">
            <div id="able">
        </div>
        </div>
    </div>

Не удалялся со страницы. В случае восстановления из клона весь DOM был просто перезаписан на точно такой же

И draggable и resizable перестали работать