How to add options for different languages on an HTML page

I have this dropdown where I get the options of English and Spanish. I want to be able to add my own translations of Spanish when I click on the link in the dropdown menu.

I have the html language set to <html lang="eng" >
and I tried setting this

<span title="Spanish"><a class="dropdown-item" lang="es" href="file:///Users/faizankhan/Desktop/Faizan%20Portfolio/">Español</a></span>```

<li class="nav-item dropdown">
                  <a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                  <div class="dropdown-menu" aria-labelledby="navbarDropdown">
                    <a class="dropdown-item" href="#">English</a>
                    <span title="Spanish"><a class="dropdown-item" lang="es" href="file:///Users/faizankhan/Desktop/Faizan%20Portfolio/">Español</a></span>

I would think that a screen reader would pronounce the word “Espanol” correctly if it had the language installed. If the document you are linking to is completely in Spanish then <html lang = "es"> in the “linked to” document. What you did is for writing a portion of the document in Spanish. Does this clarify things?