Business
Jobs
  • About Us
  • Solutions
    • Job Postings
      Post your job and receive qualified candidates in 48h.
    • Candidate Assessments
      500+ technical and psychological tests, plus anti-fraud.
    • Headhunting
      Tailor-made executive search from start to finish.
    • Payroll + EOR
      Payroll dispersal and EOR across 15+ LATAM countries.
  • Pricing
  • Jobs

0

224
Views
How to control the size of div by adding class using jquery?

sorry if the question isn't clear enough but let me explain what is happened to me.

now I have 5 graphs that have been created by Pandas and want to use jquery to affect on grid system in bootstrap. all the divs have the following class "col-md-6" except the last child which has "col-md-12", what I would like to do is: to add "col-md-6" to the last child in case of the length of graphs are even number and remove the "col-md-12" from the last one.

actually, this process is working and the class becomes added to the last child after the document is ready, however, the last graph does apply "col-md-12" and does not apply "col-md-6" even though, it has "col-md-6" but when I do a resize for the page the graph starts to apply "col-md-6" on it.

the question is How can I apply the "col-md-6" dynamically without doing resize for the page?

you can see the behavior before and after resize to understand what I mean exactly:-

before do resize before do resize

after doing a resize after doing a resize

The code is like so:-

        ...
        <div class="col-md-6 error-graph">
            {% if regular_group %}
            <div style="">
                <div style="max-width: 100%;max-height: 100%">
                    {{ regular_group|safe }}
                </div>
            </div>
            {% endif %}
        </div>

        <div class="col-md-12 error-graph">
            {% if complex_group %}
            <div style="">
                <div style="max-width: 100%;max-height: 100%">
                    {{ complex_group|safe }}
                </div>
            </div>
            {% endif %}
        </div>

<script>

    function add_class(last_child) {
        let error_graph = $(".error-graph");
        if (error_graph.length % 2 === 0) {
            last_child.removeClass("col-md-12").addClass("col-md-6");
        }
        return last_child;
    }

    function resize_graph() {
        {#$(add_class).width($(this).css("width"));#}
        let func = add_class($(".error-graph:last-child"));
        console.log(func);
        {#$(document).load(func.setWidth = 10);#}
    }

    $(document).ready(function () {
         resize_graph();
    });
</script>
about 4 years ago · Juan Pablo Isaza
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Sales
Legal
Terms and conditions Privacy policy
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Show me some job opportunities
There's an error!