多下拉javascript只工作一次

Question

大家好，我对javascript来说是全新的，我需要你们的帮助来解决我的问题。我现在将此javascript用于多级dropdown.Right，如果我将其用于两个或更多的下拉列表，则第二个下拉列表将遵循第一个下拉列表的选择顺序。

问题是，每个多级下拉列表都应该是不同的。当前下拉列表A:第一级:第一选项第二级:第一选项内容下拉列表

下拉列表B:第一级:第二选项第二级:第一选项内容下拉列表

它应该是，

下拉列表A:第一级:第一选项第二级:第一选项内容下拉列表

下拉列表B:第一级:第二选项第二级:第二选项内容下拉列表

下面是我的javascript代码：

$(document).ready(function() {
  $('#multi-dropdown').bind('change', function() {
    var elements = $('div.container').children().hide(); // hide all the elements
    var value = $(this).val();

    if (value.length) { // if somethings' selected
      elements.filter('.' + value).show(); // show the ones we want
    }
  }).trigger('change');

  $('.second-level-select').bind('change', function() {
    var elements = $('div.second-level-container').children().hide(); // hide all the elements
    var value = $(this).val();

    if (value.length) { // if somethings' selected
      elements.filter('.' + value).show(); // show the ones we want
    }
  }).trigger('change');
});

你可以在这里找到它：https://jsfiddle.net/aew2960d/