JQuery UI - Dialog - Deleting items?

JQuery UI - Dialog - Deleting items?

Hi,

Firstly, hello everyone!

Secondly, please bear with me. I only started developing a week ago - I didn't even know HTML/CSS prior to that. So It's highly likely I have made a n00b-style booboo either in my own HTML, or in the implementation of the JQUI Dialog.

Right,

I have a page, with a gallery on it. I associate the id="dialog" to the img that I wish to have pop up in a dialog and that works fine. However... as a result of this, the item associated with id="dialog" gets removed from my page completely so I can't click it a second time.

It's really strange and I can't figure it out. It doesn't matter if I move the id="dialog" to the <img>, <a> or <li>. Whatever I chose - *that* gets removed, along with anything inside of it.

Here is the header code:
  1. <script type="text/javascript">
  2. $(function() {
  3. $("#dialog").click(function(){
  4.      $("#dialog").dialog({ position: 'center'})
  5.    $("#dialog").dialog('open');  
  6.    return false;
  7.    });  
  8. });
  9. </script>
Here is the body code (has all the correct HTML around it):
  1. <ul id="portfolio">
  2. <li class="filter-0"><a href="#"><img id="dialog" src="images/item.jpg" alt="" />Item 0</a></li>
  3. <li class="filter-1"><a href="#"><img src="images/item.jpg" alt="" />Item 1</a></li>
  4. <li class="filter-2"><a href="#"><img src="images/item.jpg" alt="" />Item 2</a></li>
  5. <li class="filter-0"><a href="#"><img src="images/item.jpg" alt="" />Item 3</a></li>
  6. <li class="filter-1"><a href="#"><img src="images/item.jpg" alt="" />Item 4</a></li>
  7. <li class="filter-2"><a href="#"><img src="images/item.jpg" alt="" />Item 5</a></li>
  8. <li class="filter-0"><a href="#"><img src="images/item.jpg" alt="" />Item 6</a></li>
  9. <li class="filter-1"><a href="#"><img src="images/item.jpg" alt="" />Item 7</a></li>
  10. <li class="filter-2"><a href="#"><img src="images/item.jpg" alt="" />Item 8</a></li>
  11. <li class="filter-0"><a href="#"><img src="images/item.jpg" alt="" />Item 9</a></li>
  12. </ul>
Any ideas? Your help is much appreciated.

GG