Replace Druggable and Droppable item on event

Replace Druggable and Droppable item on event

hi all,

I have a problem with IE8 browser only. My script is follow:

I have 2 areas:

area 1 contains 2 droppable items (div)
area 2 contains 2 draggable items (div)

I have a button that change droppable e draggable items...

When I start page, it runs, but when I click on button, draggable items generate javascript error.

Example:

<div id="droppableContainer" style="width:300px; height:300px; border-style:solid; background-color:#066; margin:10px">
    <div class="droppable" id="droppable1">Droppable 1</div>
    <div class="droppable" id="droppable2">Droppable 2</div>
</div>
<div id="draggableContainer" style="width:200px; height:200px; border-style:solid; background-color:#FF6; margin:10px">
    <div id="1" class="draggable">Drag 1</div>
    <div id="2" class="draggable">Drag 2</div>
</div>
<input value="RELOAD ITEMS" type="button" onclick="javascript: change()" />

Droppable items are:
-> ID=droppable1
-> ID=droppable2

Draggable items are:
-> ID=draggable1
-> ID=draggable2

When I call change function, i replase items with:

Droppable items:
-> ID=droppable3
-> ID=droppable4

Draggable items:
-> ID=draggable3
-> ID=draggable4

hi all,

I have a problem with IE8 browser only. My script is follow:

I have 2 areas:

area 1 contains 2 droppable items (div)
area 2 contains 2 draggable items (div)

I have a button that change droppable e draggable items...

When I start page, it run, but when I click on button, draggable itemg generate javascript error.

Example:

<div id="droppableContainer" style="width:300px; height:300px; border-style:solid; background-color:#066; margin:10px">
    <div class="droppable" id="droppable1">Droppable 1</div>
    <div class="droppable" id="droppable2">Droppable 2</div>
</div>
<div id="draggableContainer" style="width:200px; height:200px; border-style:solid; background-color:#FF6; margin:10px">
    <div id="1" class="draggable">Drag 1</div>
    <div id="2" class="draggable">Drag 2</div>
</div>
<input value="RELOAD ITEMS" type="button" onclick="javascript: change()" />

Droppable items are:
-> ID=droppable1
-> ID=droppable2

Draggable items are:
-> ID=draggable1
-> ID=draggable2

When I call change function, i replase items with:

Droppable items:
-> ID=droppable3
-> ID=droppable4

Draggable items:
-> ID=draggable3
-> ID=draggable4

but script generate error when I try draggable my new items

I attach my example script

Thanks in advance

Luca

Help me please