Expand/Collapse with Popular node on Top

HTML

<div class="codecaption">Countries</div>
<br>
<div class="tree" style="padding:10px;border:1px solid #ccc;">
	<div>Country 1
    <div>Top 5
      	<div>SubRegion 1</div>
        <div>Region 1</div>
        <div>SubRegion 3</div>
        <div>SubRegion 2</div>
        <div>Region 3</div>
    </div>
		<div>Region 1</div>
		<div>Region 2
			<div>SubRegion 1</div>
			<div>SubRegion 2</div>
			<div>SubRegion 3</div>
		</div>
		<div>Region 3</div>
	</div>
	<div>Country 2
    <div>Top 5
      	<div>SubRegion 1</div>
        <div>Region 1</div>
        <div>SubRegion 3</div>
        <div>SubRegion 2</div>
        <div>Region 3</div>
    </div>
		<div>Region 1</div>
		<div>Region 2
			<div>SubRegion 1</div>
			<div>SubRegion 2</div>
			<div>SubRegion 3</div>
		</div>
		<div>Region 3</div>
	</div>
</div>

CSS

div.tree div {
 padding-left:16px;
}
div.tree div.parent div {
 display:none;
 cursor:default;
}
div.tree div.parent {
 cursor:pointer !important;
 background:transparent url(http://www.javascripttoolbox.com/jquery/plus.gif) no-repeat top left;
}
div.tree div.expanded {
 background:transparent url(http://www.javascripttoolbox.com/jquery/minus.gif) no-repeat top left;
}

JavaScript

$(function() {
	$('div.tree div:has(div)').addClass('parent'); // Requires jQuery 1.2!
	$('div.tree div').click(function() {
		var o = $(this);
		o.children('div').toggle();
		o.filter('.parent').toggleClass('expanded');
		return false;
	});
});