Get element being bound

Trying to figure out how to get the element being bound

by grippstick

HTML

<link rel="stylesheet" href="http://cdn.kendostatic.com/2012.3.1114/styles/kendo.common.min.css">
<link rel="stylesheet" href="http://cdn.kendostatic.com/2012.3.1114/styles/kendo.default.min.css">
<script src="https://kendo.cdn.telerik.com/2016.1.112/js/kendo.all.min.js"></script>
<div id='container'>
  <div data-step='1' data-bind='visibile:showStep' style='display:none;'>
    Some really complex panel for a wizard that does not look like the other steps so it would be difficult to make it a template
  </div>
  <div data-step='2' data-bind='visibile:showStep' style='display:none;'>
    <span>aaaaaaaaaaaaa</span>
  </div>
  <div data-step='3' data-bind='visibile:showStep' style='display:none;'>
    <span>sdfsdfsdfs</span>
    <input>

  </div>
  <div data-step='4' data-bind='visibile:showStep' style='display:none;'>
    <select>

    </select>
  </div>
  <div data-step='5' data-bind='visibile:showStep' style='display:none;'>
    Finished!!!!!
  </div>
</div>

JavaScript

var vm = new kendo.observable({
  currentStep: 1,
  showStep: function(e) {
		var step = vm.get('currentStep'):
    
    var s = $(e.sender);
    
    return step===s.data('step');
  }
});

kendo.bind('#container', vm)