Ensuring my webpages are W3C valid is a priority for me. I am taking steps to rectify errors one by one in order to achieve validity. Upon using the HTML5 doctype, an error was flagged.
On Line 348, Column 81: it was pointed out that the RDFa Core attribute rel is not allowed on the li element in HTML5 + RDFa 1.1 Lite documents. It was suggested to consult the HTML5 + RDFa 1.1 schema instead.
In an attempt to address this issue, I replaced rel with id to maintain W3C validation. However, the code did not function as expected. How can I modify the code below to eliminate the use of rel?
<script type="text/javascript">
$(document).ready(function() {
$(".tab_content").hide();
$(".tab_content:first").show();
$("ul.tabs li").click(function() {
$("ul.tabs li").removeClass("active");
$(this).addClass("active");
$(".tab_content").hide();
var activeTab = $(this).attr("rel");
$("#"+activeTab).fadeIn();
});
});
</script>
<ul class="tabs">
<li class="active" rel="tab2"> Reviews </li><li rel="tab3">News</li><li rel="tab4"> Articles </li></ul>
<div id="tab1" class="tab_content" style="width:326px;">data</div>
<div id="tab2" class="tab_content" style="width:326px;">data tab2</div>