$(document).ready(function() {
  createDropDown();

  $(".dropdown dt a").click(function(event) {
    event.preventDefault();
    var dropID = $(this).closest("dl").attr("id");
    $("#" + dropID).find("ul").toggle();
	//return false;
  });

  $(document).bind('click', function(e) {
    var $clicked = $(e.target);
    if (! $clicked.parents().hasClass("dropdown"))
      $(".dropdown dd ul").hide();
	//  return false;
  });




  $(".dropdown dd ul a").click(function() {

      var dl = $(this).closest("dl");
    var dropID = dl.attr("id");


    var text = $(this).html();
       var source = $("#source"+dropID.substr(-1,1));

    //var source = dl.prev();
    $("#" + dropID + " dt a").html(text);
    $("#" + dropID + " dd ul").hide();
    source.val($(this).find("span.value").html())
//zapobieganie powrotom na górę strony
return false;

  });
})

function createDropDown(){

      var i;
 //liczymy wszystkie divy zawierające nasz select
      var n = 1;
if (document.getElementById) {
while (el = document.getElementById('cel' + n)) n++;
}
    for(i=1;i<n;i++) {
    var source = $("#source"+i);
    var selected = source.find("option[selected]");  // get selected <option>
    var options = $("option", source);  // get all <option> elements
    // create <dl> and <dt> with selected value inside it

       var dropID = "dropdown_" + i;
       $("#cel"+i).append('<dl id="' + dropID + '" class="dropdown" style="padding: 0px; margin: 2px 2px 0px 0px;"></dl>');
    $("#" + dropID).append('<dt><a href="">' + selected.text() + '<span class="value">' + selected.val() + '</span></a></dt>');
    $("#" + dropID).append('<dd><ul></ul></dd>');
    


    options.each(function() {
      $("#" + dropID + " dd ul").append('<li><a href="#">' + $(this).text() + '<span class="value">' + $(this).val() + '</span></a></li>');
    });

     }
}