Как сделать появление блока при переходе по якорю?

<a href="#anchor1"></a>
<a href="#anchor2"></a>
.....
<a href="#anchorN"></a>

name="anchor1" id="1"
name="anchor2" id="2"
...
name="anchorN" id="N"

<a href="#anchor1"></a>
<div id="anchor1"></div>

$("a[href^='#anchor']").on('click', function (event) {
event.preventDefault();
event.stopPropagation();
var $this = $(this),
      $target = $($this.attr('href'));

$target.toggleClass('active');
});

$("a[href^='#']").on('click', function (event) {
event.preventDefault();
event.stopPropagation();
var $this = $(this),
      $target = $($this.attr('href'));

$target.toggleClass('active');
});

<div id="n" class="some-class">111</div>

.some-class {display:none;}
.some-class.active {display:block}

<script type="text/javascript">
if (window.jQuery) alert("jQuery подключен");
else alert("jQuery не подключен");
</script>
<script type="text/javascript">
$(document).ready(function(){
alert(jQuery.fn.jquery);
});
</script>

jQuery подключен

<script>
    $(document).ready(function(){
alert('Ваша версия jQuery ' + jQuery.fn.jquery);
});
</script>
В чем проблема что одни скрипты выполняются, а другие нет?