Question

I am building a dropdown menu for a site and i am trying to change the width of the parent div (.drop-down) depending on how many sections that instance of the element has within it. There are a total of 7 instances of .drop-down each containing different amounts of sections no more than 3 but at least 1. Here is my code where am i going wrong?

    $('.drop-down').each(function(index) {
    var numSections = $(this).find('section').length;

        if (numSections = 1) {
            $('.drop-down').css('width','300px');
        }

        else if (numSections = 2) {
            $('.drop-down').css('width','600px');
        }

        else
            $('.drop-down').css('width','840px');
    });

any help would be greatly appreciated.

Answer 1

$('.drop-down').each(function(index)
{
    var numSections = $(this).find('section').length;

    if (numSections == 1) {
        $(this).css('width', 300);
    }
    else if (numSections == 2) {
        $(this).css('width', 600);
    }
    else if (numSections == 3){
        $(this).css('width', 840);
    }
});