Как правильно вывести табы из бд?

У меня есть табы созданные с помощью bootstrap. Я хочу что бы количество табов зависело от того сколько я добавил в бд. Я добавил таблицу в бд с id и tabs то есть название таба. У меня все табы выводятся только разметка теряется!

В function.php создаю подключение к бд и чтение из бд

<?php

include 'config/config.php';

$get_id = $_GET['id'];
$get_tabs = $_GET['tabs'];

//Read
$sql = $pdo->prepare("SELECT * FROM x_tabs");
$sql->execute();
$result = $sql->fetchAll(PDO::FETCH_OBJ);

А в индексном файле создаю табы таким образом

<?php foreach ($result as $res) { ?>

<ul class="nav nav-tabs" id="myTab" role="tablist">
  <li class="nav-item">
    <a class="nav-link active" id="<?php echo $res->id; ?>" data-toggle="tab" href="#<?php echo $res->tabs; ?>" role="tab" aria-controls="<?php echo $res->tabs; ?>" aria-selected="true"><?php echo $res->tabs; ?></a>
  </li>
</ul>
<div class="tab-content" id="myTabContent">
  <div class="tab-pane fade show active" id="home" role="tabpanel" aria-labelledby="home-tab">...</div>
</div>
<?php } ?>

Правленый код

<ul class="nav nav-tabs" id="myTab" role="tablist">
<?php foreach ($result as $res) { ?>
    <li class="nav-item">
      <a class="nav-link" id="<?= $res->id; ?>" data-toggle="tab" href="#<?= $res->tabs; ?>" role="tab" aria-controls="<?= $res->tabs; ?>" aria-selected="true"><?= $res->tabs; ?></a>
    </li><?php } ?>
</ul>

<div class="tab-content" id="myTabContent">
<?php foreach ($result as $res) { ?>
  <div class="tab-pane fade show active" id="<?= $res->id; ?>" role="tabpanel" aria-labelledby="<?= $res->tabs; ?>"><?= $res->tabs; ?></div>
  </li><?php } ?>
</div>

Результат