[RESOLVED] Two floated divs, if one is empty, hide it, and make the other one width:100%

[meek]

Hi.

I have the following setup:

<style type="text/css">
.clearfix:after {
    content: ".";
    display: block;
    clear: both;
    visibility: hidden;
    line-height: 0;
    height: 0;
}
.clearfix {
    display: inline-block;
}
html[xmlns] .clearfix {
    display: block;
}
* html .clearfix {
    height: 1%;
}
body {
font-family:arial;
font-size:12px;
}
.wrapper {
    width: 200px;
    border:1px solid #000;
}
.one, .two {
    float: left;
    width: 100px;
    height: 100px;
}
.one {background-color: red}
.two {background-color: green}
</style>

and

<div class="wrapper clearfix">
        <div class="one"></div>
        <div class="two"></div>
 </div>

I would like to check if div two is empty, and if it is, the div one should stretch to full width. How is that possible with jQuery?

[Nomistake]

something like this maybe?

$('document').ready(function(){
   if($('.two').html() == ""){
      $('.two').hide();
      $('.one').css('width', '200px');
   };
});

maybe you want:

$('.one').css('width', '200px');

to be:

$('.one').css('width', '100%');

not tested :-)

[meek]

@Nomistake: It works like a charm. Thanks a lot. :-)

[Nomistake]

glad i could help :-)