Question

I have a SVG create with Raphael 2.0 which look like this :

<div class="stave">
<svg height="342" version="1.1" width="512" xmlns="http://www.w3.org/2000/svg"
style="overflow: hidden; position: relative;" viewBox="0 410 1300 80"
preserveAspectRatio="meet">
........
</svg>
</div>

i just want to set an ID to the svg tag! How can i do it? JQUERY or RAPHAEL 2.0?
i have see many answers but none works for me.

Thank you for helping

Answer 1

With jQuery you can use element selector and :nth-child().

Something like this: (jsFiddle)

<div class="frame">
    <div>div1</div>
    <div>div2</div>
    <div>div3</div>
</div>
<script type="text/javascript">
    $('div').css({'font-weight':'bold'});
    $('.frame div:nth-child(2)').attr("id","newId");
    $('#newId').css({'color':'#f30'})
</script>

Of course, in your case, selector would be $('svg')