如何为多个元素使用相同的ID？ - ArcText Wordpress作者名称JS

I am using [ArcText][1] to render the author names on a curvy path in wordpress. I am a beginner in PHP and JS.

Function:

function get_meta($id){
  echo <span id='example1'>".the_author_meta_r("display_name",$id)."</span>
}

ArcText Script:

var $example1   = $('#example1').hide();

google.load('webfont','1');

google.setOnLoadCallback(function() {
  WebFont.load({
    google        : {
      families    : ['Montserrat','Concert One']
    },
    fontactive    : function(fontFamily, fontDescription) {
      init();
    },
    fontinactive  : function(fontFamily, fontDescription) {
      init();
    }
  });
});

function init() {
  $example1.show().arctext({radius: 150, dir: -1});         
};

To display the author names I use:

<?php get_meta(1); ?><?php get_meta(2); ?><?php get_meta(3); ?>

Problem is that only (1) renders with curves and other two doesn't because three of them has the same id, and one element can have one id.

Can I rather use class? Since I dont know how many times user will use <?php get_meta(); ?>, thats why I am trying to avoid making multiple functions with multiple IDs.

function get_meta($class){
  echo <span id='example1' class='useMultiTimes'>".the_author_meta_r("display_name",$class)."</span>
}

Then in the Javascript:

var $example1   = $('.useMultiTimes').hide();

Or, you can do:

var $example1   = $("span[class='useMultiTimes']").hide();

But this will possibly hide all the elements with the same class?

<?php get_meta('useMultiTimes'); ?>