JQuery add an element 1/2 opacity

[jstreich]

I have:

[green]  $(".dragable").draggable({cancel: "a.ui-icon", revert: "invalid", containment: $("#content"), helper: "clone", cursor: "move" });
  $(".album, .photos").droppable({ accept: ".dragable", activeClass: "ui-state-highlight", drop: function( event, ui )
  {
    if($(this) != $(ui.draggable).parent())
    {
      $(ui.draggable).parent().remove($(ui.draggable));
      $(this).append($(ui.draggable));
      $.ajax({type: "POST", url: "move_photo.php", data: { photo: $(ui.draggable).attr("id"), album: $(this).attr("id")  }});
    }
  } });
  $(".dragable").click(function()
  {
    $("#viewimage").attr("src","upload/" + $(this).attr("id"));
    $("#dialog").dialog("open");
  });
[/green]
[red]//  $(".photos").sortable({opacity: 0.6, cursor: "move"});[/red]

Then later, I in an event I do:

[green]              $(".photos").append("<div id=\"" + file.fileName + "\" class=\"dragable\"><img src=\"" + e.target.result
                           + "\" style=\"max-height: 100px; max-width: 100px;\" /></div>");
[/green]
[red]              $("#" + file.fileName).draggable({cancel: "a.ui-icon", revert: "invalid", containment: $("#content"), helper: "clone", cursor: "move" });
              $("#" + file.fileName).fadeTo("fast",0.5);
              $(".album, .photos").droppable({ accept: ".dragable",
                activeClass: "ui-state-highlight", drop: function( event, ui )
              {
                if($(this) != $(ui.draggable).parent())
                {
                  $(ui.draggable).parent().remove($(ui.draggable));
                  $(this).append($(ui.draggable));
                  $.ajax({type: "POST", url: "move_photo.php", data: { photo: $(ui.draggable).attr("id"), album: $(this).attr("id")  }});
                }
              } });[/red]

It throws no errors, but the new div isn't draggable.
Sortable didn't work for existing elements, so it was commented out.
If the sortable is uncommented though, then I am able to sort only new divs and if I drag one of the new it only sort of works b/c of sort and the drop 1/2 works (ajax call works, but the newly created div doesn't show as moved).

Thoughts on what might be the issue?

New elements should also have opacity of .5, but show as full opacity when created.


[plug=shameless]

http://game-master.us/phpx-3.4.0/

[/plug]

 

[jstreich]

Fixed the opacity by using plain JavaScript, but
I'm still not able to get drag to work on appended elements, and sortable and draggable still fight.

[plug=shameless]

http://game-master.us/phpx-3.4.0/

[/plug]