From 85089794d8ac19c1208dccd69e63c3f22dabc84b Mon Sep 17 00:00:00 2001
From: Haroen Viaene <hello@haroen.me>
Date: Fri, 9 Dec 2016 15:01:46 +0100
Subject: [PATCH] use the mark tag

it's more semantic :smile:

it adds a default background colour, but we'll use the one you defined.

https://developer.mozilla.org/en/docs/Web/HTML/Element/mark
---
 06 - Type Ahead/index-FINISHED.html | 4 ++--
 06 - Type Ahead/style.css           | 2 +-
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/06 - Type Ahead/index-FINISHED.html b/06 - Type Ahead/index-FINISHED.html
index 53c36248b0..368181c148 100644
--- a/06 - Type Ahead/index-FINISHED.html	
+++ b/06 - Type Ahead/index-FINISHED.html	
@@ -38,8 +38,8 @@
   const matchArray = findMatches(this.value, cities);
   const html = matchArray.map(place => {
     const regex = new RegExp(this.value, 'gi');
-    const cityName = place.city.replace(regex, `<span class="hl">${this.value}</span>`);
-    const stateName = place.state.replace(regex, `<span class="hl">${this.value}</span>`);
+    const cityName = place.city.replace(regex, `<mark>${this.value}</mark>`);
+    const stateName = place.state.replace(regex, `<mark>${this.value}</mark>`);
     return `
       <li>
         <span class="name">${cityName}, ${stateName}</span>
diff --git a/06 - Type Ahead/style.css b/06 - Type Ahead/style.css
index 155164bae9..e98e6d3bc6 100644
--- a/06 - Type Ahead/style.css	
+++ b/06 - Type Ahead/style.css	
@@ -73,7 +73,7 @@
       font-size: 15px;
     }
 
-    .hl {
+    mark {
       background:#ffc600;
     }