Соответствующее целевое значение JS в массиве

У меня есть цикл for, который отвечает за открытие пользовательского модального окна. Кнопка открытия определяется как несколько элементов с классом .col-sm-4.

Вот код:

// Get the modal
var modal = document.getElementById('myModal');

// Get the opening trigger
var btn = document.getElementsByClassName('col-sm-4');

for (var i = 0; i < btn.length; i++) {
  // Open modal by clicking the order display
  btn[i].onclick = function(event) {

    // Check to see if target is the parent element
    if (event.target.tagName.toLowerCase() === 'div') {

      modal.style.display = 'block';
      document.getElementsByClassName('col-sm-4');
      var idDIVOrderParent = btn[0].id;
      // Having trouble grabbing the correct ID
      console.info('The order ID is ' + idDIVOrderParent);

      // extract orderId9999 from string like parentOrderId9999
      var idDIVOrder = 'o' + idDIVOrderParent.substr(7);
      console.info('The modal is currently displaying ' + idDIVOrder);

      document.getElementById(idDIVOrder).style.display = 'block';
    } else {
      // console.info('Child element clicked!');
    }
  }
}

Там, где написано, что var idDIVOrderParent = btn[0].id, у меня возникают трудности. Как я могу получить идентификатор правильного .col-sm-4, который запустил модальное окно?