JSFiddle - React, Tailwind, and code Playground

HTML

<button>Click Me</button><br/><br/>
<div id='big'>
    <div id='thearea'></div>
</div>

CSS

#thearea{width:90%;border:1px solid black;height:100%;}
#big {width:100%;text-align:center;margin:0 auto;height:200px;}

JavaScript

$(document).ready(function() {
    var myarr = [{"Name":"Bob", "Char":"134"},
               {"Name":"Phil", "Char":"134"},
               {"Name":"Jane", "Char":"1"},
               {"Name":"Don", "Char":"4"},
               {"Name":"Dan", "Char":"2"},
               {"Name":"Jan", "Char":"12"},
               {"Name":"Bill", "Char":"24"},
               {"Name":"Sam", "Char":"14"},
               {"Name":"Jake", "Char":"23"},
               {"Name":"Ben", "Char":"3"}];
    
 
    $('button').click(function() {
       for(var i = 0; i < myarr.length; i++) {
           if(myarr[i].Char.indexOf('2') !== -1) {
               alert("Name: " + myarr[i].Name + "\nChar: " + myarr[i].Char);
             return;
           } else {}
        } 
    });
    
  
});