JQuery Replaced Div Stops Responding To Mouseclick

I am trying to replace a value in a drop down box. The replacing works fine (after help from this fine community) but afterwards the slide function stops working. I can't find any errors so I'm asking if this could be related to how jQuery and javaScript works? Are elements "mapped" to the DOM on load and if so; would that imply that replacing a div with another div would result in jQuery loosing track of the divs? I use this code to check if a div is clicked:

$(document).ready(function () {
$('.button_slide').click(function () {
var num = $(this).attr('rel');
$('div.content_slide:not(.' + num + ') ').slideUp(400);
$('div.' + num).slideToggle(400);
});
return false;
});

This is the div:

<div class="button_slide" rel="slide1">Alts:</div>
<div class="content_slide slide1">
<input id="Button1" rel="slide1" class="button_vertical click_button" type="button" value="2" size="10px" />
<input id="Button2" rel="slide1" class="button_vertical click_button" type="button" value="3" />
</div>

This is the jQuery that drops down the box:
$(function () {
$('.click_button').click(function () {
var num = $(this).attr('rel');
$('.button_slide[rel="' + num + '"]').replaceWith("<div class='button_slide' rel='" + num + "' >" + $(this).val() + "</div>");
$('div.content_slide').slideUp(600);
});
});

I'm pulling my hair on this one and jQuery isn't my stronger side... How would you solve this?