I've been trying to get this XML data to show in a webpage, but I'm doing something obvious wrong, but I'm totally failing to get it to work..

The site uses an external CSS page to style it, BUT I want to show some XML data in the mainContent DIV, and style the XML with the XSLT stylesheet, not the CSS stylesheet.

.html file:
<div id="mainContent">
<p>text using the css style and showing</p>



<!--trying to start xml / xlst section-->

<?xml version="1.0"?>
<?xml-stylesheet type="text/xsl" href="hellotohtml.xsl"?>


<elementname>in html page and showing in the html page</elementname>

<!--End of trying to show xml with xlst styling-->

<p>text using the css style and showing</p>
XML file:
<?xml version="1.0" encoding="UTF-8"?>
<?xml-stylesheet href="hellotohtml.xsl" type="text/xsl"?>

<elementname>IDK why this text wont show in the html page</elementname>
.xsl file:
<?xml version="1.0"?>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">

<xsl:template match="/">

<html>


<body>


<xsl:value-of select="elementname"/>
<xsl:for-each select="elementname">
<span style="color:Yellow"><b>hgfchgf</b></span>

</xsl:for-each>
</body>
</html>
</xsl:template>
</xsl:stylesheet>
Can anyone see what I'm doing wrong?

I simply wanted the text in bold to show, styled by the .xsl file, but it not


-------------------------------------------------

In an attempt to narrow down the problem, I have made the three following files in a separate folder on the server.

I am trying to display the data in the .xml file, and have it styled by the .xsl file. In this try I am trying to make the text yellow.

.xml file:

<?xml version="1.0" encoding="UTF-8"?>

<?xml-stylesheet href="basic.xsl" type="text/xsl"?>

<elementname>not showing in the html page</elementname>



.html file:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
</head>

<body>

<h1> XML Page </h1>

<?xml version="1.0"?>
<?xml-stylesheet type="text/xsl" href="basic.xsl"?>
<elementname>between elementname in .html file</elementname>
<elementname></elementname>

<p>Back in html page </p>

</body>
.xls file:
<?xml version="1.0"?>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">

<xsl:template match="/">

<html>

<body>

<xsl:value-of select="elementname"/>
<xsl:for-each select="elementname">
<span style="color:Yellow"><b>elementname</b></span>

</xsl:for-each>
</body>
</html>
</xsl:template>
</xsl:stylesheet>
-----------------------------------------

With Firefox, when I view folder/basic.html I see:
XML Page

between elementname in .html file Back in html page
When I view the folder/basic.xml I see:

not showing in the html pageelementname
But how can I view the .xml, styled with the .xls, inside the .html page?

I want to put it inside a DIV on the .html page, which is completely styled with CSS.

The .xls style needs to override the CSS somehow.

Or does the user have to view the .xml page, is it not possible to show XML in a URL ending with .html?

I have never viewed a webpage ending with .xml before I don't think, so I am believing it is possible.


EDIT -

If I rename the .html file to a .xhtml file, and view that through Firefox I get the following:

XML Parsing Error: XML or text declaration not at start of entity
Location: http://localhost/basic/basic.xhtml
Line Number 15, Column 2: <?xml version="1.0"?>
--------^
Are users supposed to view the .xml file, the .html file or the .xhtml file?