:nth-child(2n) filter not working, but the :even filter does.
Hello there, I've spent a good while trying to find an answer to this so I'm hoping someone can help me here.
The code below works, but if you bring in the commented out code containing :nth-child(2n) it will not - I don't understand what is going on - many thanks.
http://jsfiddle.net/focusonfiddle/YVw6F/2/
<!DOCTYPE HTML>
<html>
<head>
<meta charset="UTF-8">
<title>untitled</title>
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script type="text/javascript">
$("document").ready(function() {
//$.each($('[class^="thirdCredits"]:nth-child(2n)') ,function()
$.each($('[class^="thirdCredits"]:even') ,function()
{
$(this).css("border" , "1px red solid");
});
});
</script>
</head>
<body>
<div id="tableMarkup">
<div id="myTable"></div>
<div id="template">
<ul style="width:65%; background-color:#67c1fd">
<li>This is a line of text</li>
</ul>
<ul style="width:9%;">
<li>
<div class="styled-select">
<select class="thirdCredits0">
<option value="10">10</option>
<option value="20">20</option>
<option value="30">30</option>
</select>
</div>
</li>
</ul>
<ul style="width:9%;">
<li>
<div class="styled-select">
<select class="thirdCredits1">
<option value="10">10</option>
<option value="20">20</option>
<option value="30">30</option>
</select>
</div>
</li>
</ul>
<ul style="width:9%;">
<li>
<div class="styled-select">
<select class="thirdCredits2">
<option value="10">10</option>
<option value="20">20</option>
<option value="30">30</option>
</select>
</div>
</li>
</ul>
<ul style="width:9%;">
<li>
<div class="styled-select">
<select class="thirdCredits3">
<option value="10">10</option>
<option value="20">20</option>
<option value="30">30</option>
</select>
</div>
</li>
</ul>
</div>
</div>
</body>
</html>