Running JS/JQuery inside of prototype

I'm having a problem with Prototype Draggable windows.. I have a window and i want to launch some jQuery/Ajax/JavaScript functions inside of the window but seems like nothing works.

Look an example i've made with a simple JavaScript popup script and when i click the div it doesn't show, same happens with every function i do.

<script type="text/javascript">
    function show_confirm() {
        var r = confirm("Press a button!");
        if (r == true) {
            alert("You pressed OK!");
        } else {
            alert("You pressed Cancel!");
        }
    }
</script>

<a href="#" onclick="show_confirm()"><div id="delete"></div></a>

For jQuery i already tried noconflict() and it still doesn't work.

EDIT: Here is how i set up the window:

function openApps() {
  new UI.Window({theme: "ultra_dark",
          width:  1170, 
               height: 630,
               superflousEffects: superflousEffects}).center().show().setAjaxContent('myFile.php', {
    method: "GET", 
    onCreate: function() { 
    this.header.update("Applications");   
      this.setContent('<div class="message">Please wait...</开发者_Python百科div><div class="spinner"></div>');   
    }
  });  
     }

Because it is setting the content by AJAX your script is being executed in the context of a callback. The function show_confirm probably becomes a closure within onComplete - something which you don't need to write, it is automatic.

You might need to explicitly assign it to a global variable.

window.show_confirm = function() {
    var r = confirm("Press a button!");
    if (r == true) {
        alert("You pressed OK!");
    } else {
        alert("You pressed Cancel!");
    }
}

Alternatively if you find the retrieved <script> elements are not being executed at all (I think this can happen with some domain issues) then you can use an iframe instead by replacing setAjaxContent('myFile.php', ...) with setUrl('myFile.php'). This is a compromise as I don't see how to have a loading spinner.

Why not use jQuery's UI? It has dialogue windows built in preventing any conflict.

Here's an example of its use in your context:

<script>
$(function() {
    $( "a[id=delete-item]" ).click(function(){
        $( "div[id=dialog-confirm-delete]" ).dialog({
            modal: true,
            buttons: {
                "Delete item": function() {
                    $( this ).dialog( "close" );
                },
                Cancel: function() {
                    $( this ).dialog( "close" );
                }
            }
        });
    });
});
</script>
<style>
    div[id=dialog-confirm-delete] {
        display: none;
    }
</style>
<div id="dialog-confirm-delete">
    <p>
        This item will be permanently deleted and cannot be recovered. Are you sure?
    </p>
</div>
<a id="delete-item">Delete</a>

And a working example:

http://jsfiddle.net/xsv8B/2/

Try this

<script type="text/javascript">
function show_confirm()
{
var r=confirm("Press a button!");
if (r)
  {
  alert("You pressed OK!");
  }
else
  {
  alert("You pressed Cancel!");
  }

return false;
}

//if you want to use jquery
$(function(){
   $("a").click(function(){
      var r=confirm("Press a button!");
      if (r)
      {
        alert("You pressed OK!");
      }
      else
      {
        alert("You pressed Cancel!");
      }

      return false;
   });
});
</script>



<a href="#" onclick="return show_confirm()"><div id="delete"></div></a>