title: Collapse DIV only on Mobile View - Bootstrap 3
body: <p>I have a sidebar search parameters. I want to make collapse function on this DIV only on Mobile device. Using Bootstrap 3 - Latest version.</p>
  
  <p>Here is the HTML Markup.</p>
  
  <pre><code>&lt;div class="col-md-3 col-sm-4 SearchParameters"&gt;
              &lt;h4 data-toggle="collapse" data-target="#search"&gt;Location&lt;/h4&gt;
              &lt;div class="col-md-12 sCheck no-gutter collapse" id="search"&gt;
                  &lt;h5&gt;Lahore (254)&lt;/h5&gt;
                  &lt;div class="col-md-12"&gt;
                      &lt;form role="form"&gt;
                          &lt;div class="checkbox checkbox-primary"&gt;
                              &lt;input type="checkbox" id="ModelTown"&gt;
                              &lt;label for="ModelTown"&gt;Model Town&lt;/label&gt;
                          &lt;/div&gt;
                          &lt;div class="checkbox checkbox-primary"&gt;
                              &lt;input type="checkbox" id="DHA"&gt;
                              &lt;label for="DHA"&gt;DHA&lt;/label&gt;
                          &lt;/div&gt;
                          &lt;div class="checkbox checkbox-primary"&gt;
                              &lt;input type="checkbox" id="CG"&gt;
                              &lt;label for="CG"&gt;Cavalry Ground&lt;/label&gt;
                          &lt;/div&gt;
                          &lt;div class="checkbox checkbox-primary"&gt;
                              &lt;input type="checkbox" id="Gulberg"&gt;
                              &lt;label for="Gulberg"&gt;Gulberg&lt;/label&gt;
                          &lt;/div&gt;
                          &lt;div class="checkbox checkbox-primary"&gt;
                              &lt;input type="checkbox" id="Samnabad"&gt;
                              &lt;label for="Samnabad"&gt;Samnabad&lt;/label&gt;
                          &lt;/div&gt;
                          &lt;div class="checkbox checkbox-primary"&gt;
                              &lt;input type="checkbox" id="AIT"&gt;
                              &lt;label for="AIT"&gt;Allama Iqbal Town&lt;/label&gt;
                          &lt;/div&gt;
                          &lt;div class="checkbox checkbox-primary"&gt;
                              &lt;input type="checkbox" id="GardenTown"&gt;
                              &lt;label for="GardenTown"&gt;Garden Town&lt;/label&gt;
                          &lt;/div&gt;
                          &lt;div class="checkbox checkbox-primary"&gt;
                              &lt;input type="checkbox" id="Township"&gt;
                              &lt;label for="Township"&gt;Township&lt;/label&gt;
                          &lt;/div&gt;
                          &lt;div class="checkbox checkbox-primary"&gt;
                              &lt;input type="checkbox" id="FaisalTown"&gt;
                              &lt;label for="FaisalTown"&gt;Faisal Town&lt;/label&gt;
                          &lt;/div&gt;
                          &lt;a href="#"&gt;20 more locations&lt;/a&gt;
                      &lt;/form&gt;
                  &lt;/div&gt;&lt;!-- form-group --&gt;
                  &lt;div class="clearfix"&gt;&lt;/div&gt;
                  &lt;h5 class="second"&gt;Availability&lt;/h5&gt;
  
                  &lt;div class="col-md-12 SelectDays"&gt;
                      &lt;a href="#" class="Day"&gt;M&lt;/a&gt;
                      &lt;a href="#" class="Day"&gt;T&lt;/a&gt;
                      &lt;a href="#" class="Day active"&gt;W&lt;/a&gt;
                      &lt;a href="#" class="Day"&gt;Th&lt;/a&gt;
                      &lt;a href="#" class="Day"&gt;F&lt;/a&gt;
                      &lt;a href="#" class="Day"&gt;S&lt;/a&gt;
                      &lt;a href="#" class="Day"&gt;SU&lt;/a&gt;
                  &lt;/div&gt;&lt;!-- SelectDays --&gt;
  
                  &lt;div class="col-md-12 TimeSet"&gt;
                      &lt;!-- timeFunction --&gt;
                  &lt;/div&gt;&lt;!-- TimeSet --&gt;
  
              &lt;/div&gt;&lt;!-- col-md-12 --&gt;
          &lt;/div&gt;&lt;!-- SearchParameters --&gt;
  </code></pre>
  
  <p>The SearchParameters DIV I use to give styling to the code.</p>
  
  <p>Note : I want to collapse "SearchParameters" div only on mobile and opened it with a button.. There should be only 1 div.  I can hide this div and show another div which is visible on mobile devices but that's not a good approach. I want to collapse this div and show it on button click only on mobile devices.</p>