JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
<!-- 
  Bootstrap docs: https://getbootstrap.com/docs
-->

<div class = "container">
<div id="myElement">Click me.</div>
  <div class="row">
    <div class="col-md-8 col-sm-8">
      <p>
        Fruits: <br>
        <button id="peach">Peach</button><br>
        <button id="strawberry">Strawberry</button><br>
        <button id="watermelon">Watermelon</button><br>
        <button id="grape">Grape</button><br>
        <button id="apple">Apple</button><br>
        <button id="banana">Banana</button><br>
        <button id="submitFruit">Submit</button><br>
      </p>  
    </div>
    <div class="col-md-8 col-sm-8">
      <p>
        Vegetables:<br>
        <button id="carrot">Carrot</button><br>
        <button id="cucumber">Cucumber</button><br>
        <button id="radish">Radish</button><br>
        <button id="lettuce">Lettuce</button><br>
      </p>  
    </div>
    
    <div class="col-md-6 col-sm-6">
      <p>
        Baskets:<br>
        <button id="blue">Blue</button><br>
        <button id="red">Red</button><br>
        <button id="green">Green</button><br>
        <button id="purple">Purple</button><br>
        <button id="yellow">Yellow</button><br>
      </p>
    </div>
  </div>

</div>
<!-- 
<div class="container">
<form action="/action_page.php">
  <div class="form-group">
    <label for="sel1">Fruits:</label>
      <select class="form-control" id="sel1">
        <option></option>
        <option>Peach</option>
        <option>Strawberry</option>
        <option>Watermelon</option>
        <option>Grape</option>
        <option>Apple</option>
        <option>Banana</option>
      </select>
  </div>
  <div class="form-group">
    <label for="sel1">Vegetables:</label>
     ...

CSS

.row {
  background: #f8f9fa;
  margin-top: 20px;
}

.col {
  border: solid 1px #6c757d;
  padding: 10px;
}

JavaScript

window.addEvent('domready', function(){
	console.log("hello");
	var peach;
  /* $('peach').addEvent('click', function(){
    console.log('peach')
  }); */
  /* $('myElement').addEvent('click', function(){
    alert('clicked!');
    }); */
});