javascript - Change stroke width of a svg image with click function jquery -

i want increase stroke width of svg image 0.5 when user clicks on button. have click function already, not sure how function work increase stroke width.

function pipescalefactorplus(){     $(".pipe").style("stroke-width", "+=0.5");    drawmappipes();     } 

.pipe svg class , drawmappipes(); called redraw svg image.

assuming using normal jquery only. here how can adjust stroke width.

note have little modify svg properties because have names differ style property names.

for example, attribute named stroke-width, style property strokewidth.

$("button").click(function(evt) {    var myline = $("line");    // current stroke-width.    // try getting style object first. otherwise direct    // attribute value.    // use parseint() strip off units ("20px" -> 20)    var currentwidth = parseint(myline.css("strokewidth") || myline.attr("stroke-width"), 10);    // update style property "strokewidth".    // note property has different spelling attribute.    myline.css("strokewidth", 30 - currentwidth);  });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>    <svg>    <line y1="75" x2="300" y2="75" stroke="black" stroke-width="10"/>  </svg>    <button>click me</button>