Fixed the problem of no display name issue (Azure#16348)

Co-authored-by: Sima Zhu <sizhu@microsoft.com>

Author: azure-sdk

eng/common/docgeneration/Generate-DocIndex.ps1

@@ -165,7 +165,7 @@ function UpdateDocIndexFiles {
     $docfxContent = Get-Content -Path $DocfxJsonPath -Raw
     $docfxContent = $docfxContent -replace "`"_appTitle`": `"`"", "`"_appTitle`": `"Azure SDK for $appTitleLang`""
     $docfxContent = $docfxContent -replace "`"_appFooter`": `"`"", "`"_appFooter`": `"Azure SDK for $appTitleLang`""
-    Set-Content -Path $DocfxJsonPath -Value $docfxContent
+    Set-Content -Path $DocfxJsonPath -Value $docfxContent -NoNewline
     # Update main.js var lang
     $mainJsContent = Get-Content -Path $MainJsPath -Raw
     $mainJsContent = $mainJsContent -replace "var SELECTED_LANGUAGE = ''", "var SELECTED_LANGUAGE = '$lang'"

eng/common/docgeneration/docfx.json

@@ -70,9 +70,3 @@
     }    
   }
 }
-
-
-
-
-
-

eng/common/docgeneration/templates/matthews/styles/main.js

@@ -162,8 +162,12 @@ function populateIndexList(selector, packageName) {
     httpGetLatestAsync(latestPreviewUrl, latestVersions, packageName)
     var publishedVersions = $('<ul style="display: none;"></ul>')
     var collapsible = $('<div class="versionarrow">&nbsp;&nbsp;&nbsp;Other versions</div>')
-
-    $(selector).next().after(latestVersions)
+    // Check whether it has display name tag.
+    if ($(selector).next().is('h5')) {
+        $(selector).next().after(latestVersions)
+    } else {
+        $(selector).after(latestVersions)
+    }
     $(latestVersions).after(collapsible)
     $(collapsible).after(publishedVersions)
     // Add collapsible arrows on versioned docs.
@@ -216,8 +220,3 @@ $(function () {
         populateOptions($('#navbar'), pkgName)
     }
 })
-
-
-
-
-