Call js function defined in a babel script from HTML

I am including my js file into my main html file like so

<script type="text/babel" src="js/scripts.js"></script>

Then I call one of my functions like so

<div class="allButton" id="completeAll" onclick="showAll('completeColumn');">Show All (...)</div>

the function looks like this

function showAll(column) {
  $('div[id^='+column+']').removeClass('hide');
};

When I click the button(div) I get this error Uncaught ReferenceError: showAll is not defined

I am using the text/babel as my script type because the file contains React JS stuff. I have no idea why I simply cannot call my function. I am extremely new to ReactJS and Babel. (note: I am not using npm/gulp due to limitations)

Any help and/or advice would be appreciated