change bootstrap div class with jquery button click

when page loading i want to show 2 col-md-6 div and one button saying "click to show third div". if someone click the button, i want to toggle third div col-md-4 and change previous 2 col-md-6 to col-md-4. Change button to "click to hide 3 rd div"

HTML

<div class="container">
<h1>Hello World!</h1>
<div class="row pull-right" style="margin-bottom:10px;"> <button class="btn btn-primary" id="btncontrol">Click to Add </button> </div>
<div style="clear:both">
    <div class="row">
        <div class="col-sm-6" id="col_fld_6" style="background-color:lavender;">.col-sm-4</div>
        <div class="col-sm-6" id="col_fld_62" style="background-color:lavenderblush;">.col-sm-4</div>
        <div class="col-sm-4" style="background-color:#E6B2A4;display:none" id="last_div">.col-sm-4</div>
    </div>
</div>

Answers 1

Related Articles