parse my xml file and use regular expresion for doing a search javasscript

parse my xml file and use regular expresion for doing a search javasscript

I am trying to search through my xml file. It does the search, but
populates the search exactly how it is in the xml file. I am trying to do
a search where a minimum of 3 characters can be typed, regardless of it
being case sensitive. please help.
<script lang="javascript" type="text/javascript">
var StylistListXML;
var xmlDoc;
function loadXML(fileName) {
if (window.XMLHttpRequest) {// code for IE7+, Firefox, Chrome,
Opera, Safari
xmlhttp = new XMLHttpRequest();
}
else {// code for IE6, IE5
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.open("GET", "StylistList.xml", false);
xmlhttp.send();
xmlDoc = xmlhttp.responseXML;
xmlDoc.async = false;
return xmlDoc;
}
function showAllStylst() {
displayDocument(false);
}
function displayDocument(search) {
var StylistListXML = loadXML("StylistList.xml");
var StylistListXML_root = StylistListXML.documentElement;
var stylistInfo_array =
StylistListXML_root.getElementsByTagName('stylistInfo');
var stlyist_ul = document.getElementById("stylist");
var search_field_div =
document.getElementById("search_field").value.replace('/^[a-zA-Z].*$/');
//console.debug("hello world");
clearStylist();
for (var i = 0 ; i < stylistInfo_array.length; i++) {
var nameElement =
stylistInfo_array[i].getElementsByTagName('Name')[0];
var CityElement =
stylistInfo_array[i].getElementsByTagName('City')[0];
var ProvinceElement =
stylistInfo_array[i].getElementsByTagName('Province')[0];
var li_element = document.createElement('li');
var h2_element = document.createElement('h2');
var h4_element = document.createElement('h4');
var h42_element = document.createElement('h4');
var name_text =
nameElement.firstChild.nodeValue.replace('/^[a-zA-Z].*$/');
var city_text =
CityElement.firstChild.nodeValue.replace('/^[a-zA-Z].*$/');
var province_text = ProvinceElement.firstChild.nodeValue
h2_element.appendChild(document.createTextNode(name_text));
li_element.appendChild(h2_element);
h4_element.appendChild(document.createTextNode(city_text));
li_element.appendChild(h4_element);
h42_element.appendChild(document.createTextNode(province_text));
li_element.appendChild(h42_element);
if (i % 2 == 1 && search == false) {
li_element.setAttribute('class', 'zebra_background');
}
if (search == true) {
if (search_field_div == name_text || search_field_div ==
city_text) {
stlyist_ul.appendChild(li_element);
}
} else {
stlyist_ul.appendChild(li_element);
}
var lis = document.getElementsByTagName('li');
if (lis.length == 0) {
var li_element = document.createElement('li');
li_element.appendChild(document.createTextNode(search_field_div
+ " not found."));
stlyist_ul.appendChild(li_element);
}
}
console.debug(name_text);
}
function clearStylist() {
var lis = document.getElementsByTagName('li');
for (var i = lis.length - 1; i >= 0; i--) {
var parent = lis[i].parentNode;
parent.removeChild(lis[i]);
}
}
function searchAStylist() {
displayDocument(true);
}
function validate() {
return false;
}
</script>
<?xml version="1.0" encoding="UTF-8" standalone="yes"?>
<stylistData xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance">
<stylistInfo>
<Name>Allan, Allan</Name>
<WorkPhone>999.999.999</WorkPhone>
<Address>3Allan Allan</Address>
<City>Test TEst</City>
<Province>TEster</Province>
<PostalCode>w34w5t</PostalCode>
<Country>CAN</Country>
<Email>1234@gmail.com</Email>
</stylistInfo>
<stylistInfo>
<Name>Allan, Allan</Name>
<WorkPhone>999.999.999</WorkPhone>
<Address>3Allan Allan</Address>
<City>Test TEst</City>
<Province>TEster</Province>
<PostalCode>w34w5t</PostalCode>
<Country>CAN</Country>
<Email>1234@gmail.com</Email>
</stylistInfo>
<stylistData>
Any type of help would be appreciated. I am kinda still wrapping my head
around this regular expressions, and where i would thorow it in my code