title: Why is the return false not working on a switch statement?
body: <p>I'm running a Javascript <em>Switch Statement</em> when clicking on any element in the body. 
  So, when a match is found (in this case, I'm targeting a button class and returning false), the <em>break keyword</em> should stop the execution and ignore all the rest of the code. Instead, the <em>default code block</em> still runs when I click on the button. It triggers a console message that I've set in the <em>default code block</em> and it shouldn't.</p>
  
  <p>Why is the <strong>return false or break keyword</strong> not working?</p>
  
  <p>How can I stop the <strong>default code block</strong> from running when there is already a match?</p>
  
  <p>(Open the console to see messages)
  Here is an example <a href="https://jsfiddle.net/h9sj4hLz/1/" rel="nofollow noreferrer">Jsfiddle</a></p>
  
  <p><strong>Javascript</strong>   </p>
  
  <pre><code> $(document).on('click', function(event) {
  
    var e = $( this );
    var eClass = e.attr( 'class' );
  
    switch( eClass ){
  
        case 'btn-default':
  
               return false;
  
               break;
  
        default:
  
            var identifier = $( '.identifier' );
  
            if (!$(event.target).find( $( identifier ) ).length ) {
  
                  console.log( 'Identical' );
  
            }            
         }
  
  
   });
  </code></pre>
  
  <p><strong>HTML</strong></p>
  
  <pre><code> &lt;div class="row"&gt;
      &lt;div class="col visible" data-id="el_1"&gt;
          Visible Content
      &lt;/div&gt;
      &lt;div class="col"&gt;
          &lt;button type="button" class="btn btn-default"&gt;
             Click
          &lt;/button&gt;
      &lt;/div&gt;
    &lt;/div&gt;
  
    &lt;div class="identifier" id="el_1"&gt;&lt;/div&gt;
  </code></pre>