recipePage.html

<!doctype html>
<html>
    <head>
        <meta charset="utf-8">
        <title>Cocktails</title>
        <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.0.0/css/bootstrap.min.css" />
        <link href="https://fonts.googleapis.com/css?family=Monoton" rel="stylesheet">
        <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
        <link rel="stylesheet" href="./assets/css/homePageStyle.css">

        <meta name="viewport" content="width=device-width">

        <!-- Favicon -->
        <link rel="shortcut icon" href="assets/images/favicon.ico">
        
        <!-- For articles search -->
        <script src="assets/javascript/recipe.js"></script>
    </head>

    <body>
        <div class="container">
<!-- This is Jumbo Header -->
            <div class="jumbotron"><h1>Bottoms Up!!!</h1></div>
<!-- This is Recipe Display -->
            <div class="card">
                <div class="card-header">Cocktail Recipe</div>
                    <div class="card-body">
                        <div id="cocktailRecipe"></div>
                    </div>
            </div>
        </div>
    </body>

</html>
             